diff --git a/README.md b/README.md index 75379cb..840d74a 100644 --- a/README.md +++ b/README.md @@ -28,6 +28,39 @@ Example Astro app configured for [Webflow Cloud](https://webflow.com/cloud). | `npm run preview` | Build and preview with Wrangler locally | | `npm run deploy` | Deploy with Webflow Cloud CLI | +## Set up Webflow CLI + +Install Webflow CLI (global install is optional; you can also run the CLI without `npx` in the export step below). + +```bash +npm install -g @webflow/webflow-cli +``` + +Log in to Webflow and select your desired workspace from the opened browser window. You can append `--force` to reset any existing authentication. + +```bash +npx webflow auth login +``` + +Then, install the needed dependencies. + +```bash +npm install +``` + +Sync all the Webflow components into your local filesystem. Answer the prompts to generate and configure your `webflow.json`. + +```bash +npx webflow devlink export +``` + +Select your desired Webflow site from the sites listed. + +You can also view our DevLink documentation to learn more about all the options, features, and supported elements. + +The `webflow.json` `devlink-export` block tells the Webflow CLI where to write generated React components from your linked Webflow site. After running `webflow cloud init` (or `webflow auth login` + `webflow devlink export`) the CLI populates `./src/webflow/` with components you can import directly into your Vite app. + + ## Learn more - [Astro documentation](https://docs.astro.build) diff --git a/src/layouts/Layout.astro b/src/layouts/Layout.astro index 35394fb..20afb45 100644 --- a/src/layouts/Layout.astro +++ b/src/layouts/Layout.astro @@ -1,15 +1,16 @@ --- -import { DevLinkProvider } from "../../webflow/DevLinkProvider"; -import { DEVLINK_SCOPE_CLASS } from "../../webflow/devlinkScope"; +import { DevLinkProvider } from '../../webflow/DevLinkProvider'; +import { DevLinkFontTags } from '../../webflow/webflow_modules/DevLinkFontTags'; import "../../webflow/css/global.css"; // Webflow Styles --- - + + diff --git a/webflow.json b/webflow.json index 2c927ce..0aecd9c 100644 --- a/webflow.json +++ b/webflow.json @@ -2,11 +2,12 @@ "cloud": { "framework": "astro" }, - "devlink": { - "rootDir": "./devlink", - "cssModules": true, - "fileExtensions": { - "js": "jsx" - } + "devlink-export": { + "rootDir": "./webflow", + "components": ".*", + "componentGroups": ".*", + "ts": false, + "cssScopes": true, + "relativeHrefRoot": "/" } -} +} \ No newline at end of file