diff --git a/.github/workflows/ci.yml b/.github/workflows/ci.yml index de933644c..84a7828d5 100644 --- a/.github/workflows/ci.yml +++ b/.github/workflows/ci.yml @@ -99,7 +99,8 @@ jobs: with: name: artifacts path: | - packages/**/dist/** + packages/*/dist/** + packages/*/*/dist/** packages/webapi/mod.js packages/webapi/mod.js.map if-no-files-found: error diff --git a/examples/blog-multiple-authors/astro.config.mjs b/examples/blog-multiple-authors/astro.config.mjs index a024b64b4..5a51e487a 100644 --- a/examples/blog-multiple-authors/astro.config.mjs +++ b/examples/blog-multiple-authors/astro.config.mjs @@ -1,7 +1,8 @@ import { defineConfig } from 'astro/config'; +import preact from '@astrojs/preact'; // https://astro.build/config export default defineConfig({ - // Enable the Preact renderer to support Preact JSX components. - renderers: ['@astrojs/renderer-preact'], + // Enable the Preact integration to support Preact JSX components. + integrations: [preact()], }); diff --git a/examples/blog-multiple-authors/package.json b/examples/blog-multiple-authors/package.json index d2e77885d..c3d7d7b98 100644 --- a/examples/blog-multiple-authors/package.json +++ b/examples/blog-multiple-authors/package.json @@ -9,7 +9,7 @@ "preview": "astro preview" }, "devDependencies": { - "@astrojs/renderer-preact": "^0.5.0", + "@astrojs/preact": "^0.0.1", "astro": "^0.24.3", "sass": "^1.49.9" } diff --git a/examples/blog/astro.config.mjs b/examples/blog/astro.config.mjs index f682daa06..e8f14324a 100644 --- a/examples/blog/astro.config.mjs +++ b/examples/blog/astro.config.mjs @@ -1,8 +1,9 @@ import { defineConfig } from 'astro/config'; +import preact from '@astrojs/preact'; // https://astro.build/config export default defineConfig({ - renderers: ['@astrojs/renderer-preact'], + integrations: [preact()], buildOptions: { site: 'https://example.com/', }, diff --git a/examples/blog/package.json b/examples/blog/package.json index 13b11a14c..4e0efd07d 100644 --- a/examples/blog/package.json +++ b/examples/blog/package.json @@ -10,6 +10,6 @@ }, "devDependencies": { "astro": "^0.24.3", - "@astrojs/renderer-preact": "^0.5.0" + "@astrojs/preact": "^0.0.1" } } diff --git a/examples/component/demo/astro.config.mjs b/examples/component/demo/astro.config.mjs index c6e58dbdc..882e6515a 100644 --- a/examples/component/demo/astro.config.mjs +++ b/examples/component/demo/astro.config.mjs @@ -1,7 +1,4 @@ import { defineConfig } from 'astro/config'; // https://astro.build/config -export default defineConfig({ - // Comment out "renderers: []" to enable Astro's default component support. - renderers: [], -}); +export default defineConfig({}); diff --git a/examples/docs/astro.config.mjs b/examples/docs/astro.config.mjs index 9f97b3a89..7ae8d6f7b 100644 --- a/examples/docs/astro.config.mjs +++ b/examples/docs/astro.config.mjs @@ -1,11 +1,13 @@ import { defineConfig } from 'astro/config'; +import preact from '@astrojs/preact'; +import react from '@astrojs/react'; // https://astro.build/config export default defineConfig({ - renderers: [ - // Enable the Preact renderer to support Preact JSX components. - '@astrojs/renderer-preact', - // Enable the React renderer, for the Algolia search component - '@astrojs/renderer-react', + integrations: [ + // Enable Preact to support Preact JSX components. + preact(), + // Enable React for the Algolia search component. + react(), ], }); diff --git a/examples/docs/package.json b/examples/docs/package.json index 60000c43f..ab596ccce 100644 --- a/examples/docs/package.json +++ b/examples/docs/package.json @@ -17,8 +17,8 @@ "react-dom": "^17.0.2" }, "devDependencies": { - "@astrojs/renderer-preact": "^0.5.0", - "@astrojs/renderer-react": "^0.5.0", + "@astrojs/preact": "^0.0.1", + "@astrojs/react": "^0.0.1", "astro": "^0.24.3" } } diff --git a/examples/env-vars/astro.config.mjs b/examples/env-vars/astro.config.mjs index e3579a160..882e6515a 100644 --- a/examples/env-vars/astro.config.mjs +++ b/examples/env-vars/astro.config.mjs @@ -1,6 +1,4 @@ import { defineConfig } from 'astro/config'; // https://astro.build/config -export default defineConfig({ - renderers: [], -}); +export default defineConfig({}); diff --git a/examples/framework-alpine/astro.config.mjs b/examples/framework-alpine/astro.config.mjs index 9827239bb..ade2c1278 100644 --- a/examples/framework-alpine/astro.config.mjs +++ b/examples/framework-alpine/astro.config.mjs @@ -2,6 +2,6 @@ import { defineConfig } from 'astro/config'; // https://astro.build/config export default defineConfig({ - // No renderers are needed for AlpineJS support, just use Astro components! - renderers: [], + // No integrations are needed for AlpineJS support, just use Astro components! + integrations: [], }); diff --git a/examples/framework-lit/astro.config.mjs b/examples/framework-lit/astro.config.mjs index c86c77bf7..99733e933 100644 --- a/examples/framework-lit/astro.config.mjs +++ b/examples/framework-lit/astro.config.mjs @@ -1,7 +1,8 @@ import { defineConfig } from 'astro/config'; +import lit from '@astrojs/lit'; // https://astro.build/config export default defineConfig({ - // Enable the lit renderer to support LitHTML components and templates. - renderers: ['@astrojs/renderer-lit'], + // Enable Lit to support LitHTML components and templates. + integrations: [lit()], }); diff --git a/examples/framework-lit/package.json b/examples/framework-lit/package.json index 4d68428b5..651dbf2ab 100644 --- a/examples/framework-lit/package.json +++ b/examples/framework-lit/package.json @@ -9,7 +9,7 @@ "preview": "astro preview" }, "devDependencies": { - "@astrojs/renderer-lit": "^0.4.0", + "@astrojs/lit": "^0.0.1", "astro": "^0.24.3" } } diff --git a/examples/framework-multiple/astro.config.mjs b/examples/framework-multiple/astro.config.mjs index 90f8b2ca4..4b50887cd 100644 --- a/examples/framework-multiple/astro.config.mjs +++ b/examples/framework-multiple/astro.config.mjs @@ -1,7 +1,12 @@ import { defineConfig } from 'astro/config'; +import preact from '@astrojs/preact'; +import react from '@astrojs/react'; +import svelte from '@astrojs/svelte'; +import vue from '@astrojs/vue'; +import solid from '@astrojs/solid-js'; // https://astro.build/config export default defineConfig({ - // Enable many renderers to support all different kinds of components. - renderers: ['@astrojs/renderer-preact', '@astrojs/renderer-react', '@astrojs/renderer-svelte', '@astrojs/renderer-vue', '@astrojs/renderer-solid'], + // Enable many frameworks to support all different kinds of components. + integrations: [preact(), react(), svelte(), vue(), solid()], }); diff --git a/examples/framework-multiple/package.json b/examples/framework-multiple/package.json index 1b299dba9..e24f45a97 100644 --- a/examples/framework-multiple/package.json +++ b/examples/framework-multiple/package.json @@ -9,12 +9,12 @@ "preview": "astro preview" }, "devDependencies": { - "@astrojs/renderer-lit": "^0.4.0", - "@astrojs/renderer-preact": "^0.5.0", - "@astrojs/renderer-react": "^0.5.0", - "@astrojs/renderer-solid": "^0.4.0", - "@astrojs/renderer-svelte": "^0.5.2", - "@astrojs/renderer-vue": "^0.4.0", + "@astrojs/lit": "^0.0.1", + "@astrojs/preact": "^0.0.1", + "@astrojs/react": "^0.0.1", + "@astrojs/solid-js": "^0.0.1", + "@astrojs/svelte": "^0.0.1", + "@astrojs/vue": "^0.0.1", "astro": "^0.24.3" } } diff --git a/examples/framework-preact/astro.config.mjs b/examples/framework-preact/astro.config.mjs index a024b64b4..b1c8d1150 100644 --- a/examples/framework-preact/astro.config.mjs +++ b/examples/framework-preact/astro.config.mjs @@ -1,7 +1,8 @@ import { defineConfig } from 'astro/config'; +import preact from '@astrojs/preact'; // https://astro.build/config export default defineConfig({ - // Enable the Preact renderer to support Preact JSX components. - renderers: ['@astrojs/renderer-preact'], + // Enable Preact to support Preact JSX components. + integrations: [preact()], }); diff --git a/examples/framework-preact/package.json b/examples/framework-preact/package.json index 23e834b17..68ad0fabf 100644 --- a/examples/framework-preact/package.json +++ b/examples/framework-preact/package.json @@ -9,7 +9,7 @@ "preview": "astro preview" }, "devDependencies": { - "@astrojs/renderer-preact": "^0.5.0", + "@astrojs/preact": "^0.0.1", "astro": "^0.24.3" } } diff --git a/examples/framework-react/astro.config.mjs b/examples/framework-react/astro.config.mjs index b35ad27e9..4b5a68ec0 100644 --- a/examples/framework-react/astro.config.mjs +++ b/examples/framework-react/astro.config.mjs @@ -1,7 +1,8 @@ import { defineConfig } from 'astro/config'; +import react from '@astrojs/react'; // https://astro.build/config export default defineConfig({ - // Enable the React renderer to support React JSX components. - renderers: ['@astrojs/renderer-react'], + // Enable React to support React JSX components. + integrations: [react()], }); diff --git a/examples/framework-react/package.json b/examples/framework-react/package.json index 399246155..f0d36db78 100644 --- a/examples/framework-react/package.json +++ b/examples/framework-react/package.json @@ -9,7 +9,7 @@ "preview": "astro preview" }, "devDependencies": { - "@astrojs/renderer-react": "^0.5.0", + "@astrojs/react": "^0.0.1", "astro": "^0.24.3" } } diff --git a/examples/framework-solid/astro.config.mjs b/examples/framework-solid/astro.config.mjs index c78642c43..623fb8ea5 100644 --- a/examples/framework-solid/astro.config.mjs +++ b/examples/framework-solid/astro.config.mjs @@ -1,7 +1,8 @@ import { defineConfig } from 'astro/config'; +import solid from '@astrojs/solid-js'; // https://astro.build/config export default defineConfig({ - // Enable the Solid renderer to support Solid JSX components. - renderers: ['@astrojs/renderer-solid'], + // Enable Solid to support Solid JSX components. + integrations: [solid()], }); diff --git a/examples/framework-solid/package.json b/examples/framework-solid/package.json index e11ec1ca5..d76f69b27 100644 --- a/examples/framework-solid/package.json +++ b/examples/framework-solid/package.json @@ -9,7 +9,7 @@ "preview": "astro preview" }, "devDependencies": { - "@astrojs/renderer-solid": "^0.4.0", + "@astrojs/solid-js": "^0.0.1", "astro": "^0.24.3" } } diff --git a/examples/framework-svelte/astro.config.mjs b/examples/framework-svelte/astro.config.mjs index 4452ef101..194e45917 100644 --- a/examples/framework-svelte/astro.config.mjs +++ b/examples/framework-svelte/astro.config.mjs @@ -1,7 +1,8 @@ import { defineConfig } from 'astro/config'; +import svelte from '@astrojs/svelte'; // https://astro.build/config export default defineConfig({ - // Enable the Svelte renderer to support Svelte components. - renderers: ['@astrojs/renderer-svelte'], + // Enable Svelte to support Svelte components. + integrations: [svelte()], }); diff --git a/examples/framework-svelte/package.json b/examples/framework-svelte/package.json index 4370b867f..1c3bd34ca 100644 --- a/examples/framework-svelte/package.json +++ b/examples/framework-svelte/package.json @@ -9,7 +9,7 @@ "preview": "astro preview" }, "devDependencies": { - "@astrojs/renderer-svelte": "^0.5.2", + "@astrojs/svelte": "^0.0.1", "astro": "^0.24.3" } } diff --git a/examples/framework-vue/astro.config.mjs b/examples/framework-vue/astro.config.mjs index 563e8b8fc..f30130a95 100644 --- a/examples/framework-vue/astro.config.mjs +++ b/examples/framework-vue/astro.config.mjs @@ -1,7 +1,8 @@ import { defineConfig } from 'astro/config'; +import vue from '@astrojs/vue'; // https://astro.build/config export default defineConfig({ - // Enable the Vue renderer to support Vue components. - renderers: ['@astrojs/renderer-vue'], + // Enable Vue to support Vue components. + integrations: [vue()], }); diff --git a/examples/framework-vue/package.json b/examples/framework-vue/package.json index e8779da77..21c1df412 100644 --- a/examples/framework-vue/package.json +++ b/examples/framework-vue/package.json @@ -9,7 +9,7 @@ "preview": "astro preview" }, "devDependencies": { - "@astrojs/renderer-vue": "^0.4.0", + "@astrojs/vue": "^0.0.1", "astro": "^0.24.3" } } diff --git a/examples/integrations-playground/.gitignore b/examples/integrations-playground/.gitignore new file mode 100644 index 000000000..c82467453 --- /dev/null +++ b/examples/integrations-playground/.gitignore @@ -0,0 +1,17 @@ +# build output +dist + +# dependencies +node_modules/ + +# logs +npm-debug.log* +yarn-debug.log* +yarn-error.log* + +# environment variables +.env +.env.production + +# macOS-specific files +.DS_Store diff --git a/examples/integrations-playground/.npmrc b/examples/integrations-playground/.npmrc new file mode 100644 index 000000000..ef83021af --- /dev/null +++ b/examples/integrations-playground/.npmrc @@ -0,0 +1,2 @@ +# Expose Astro dependencies for `pnpm` users +shamefully-hoist=true diff --git a/examples/integrations-playground/.stackblitzrc b/examples/integrations-playground/.stackblitzrc new file mode 100644 index 000000000..43798ecff --- /dev/null +++ b/examples/integrations-playground/.stackblitzrc @@ -0,0 +1,6 @@ +{ + "startCommand": "npm start", + "env": { + "ENABLE_CJS_IMPORTS": true + } +} \ No newline at end of file diff --git a/examples/integrations-playground/README.md b/examples/integrations-playground/README.md new file mode 100644 index 000000000..0910d4b88 --- /dev/null +++ b/examples/integrations-playground/README.md @@ -0,0 +1,7 @@ +# Integration Playground + +``` +npm init astro -- --template integration-playground +``` + +[![Open in StackBlitz](https://developer.stackblitz.com/img/open_in_stackblitz.svg)](https://stackblitz.com/github/withastro/astro/tree/latest/examples/integration-playground) diff --git a/examples/integrations-playground/astro.config.mjs b/examples/integrations-playground/astro.config.mjs new file mode 100644 index 000000000..a1f21fe0b --- /dev/null +++ b/examples/integrations-playground/astro.config.mjs @@ -0,0 +1,12 @@ +import { defineConfig } from 'astro/config'; + +import lit from '@astrojs/lit'; +import react from '@astrojs/react'; +import tailwind from '@astrojs/tailwind'; +import turbolinks from '@astrojs/turbolinks'; +import sitemap from '@astrojs/sitemap'; +import partytown from '@astrojs/partytown'; + +export default defineConfig({ + integrations: [lit(), react(), tailwind(), turbolinks(), partytown(), sitemap()], +}); diff --git a/examples/integrations-playground/package.json b/examples/integrations-playground/package.json new file mode 100644 index 000000000..23b8c21df --- /dev/null +++ b/examples/integrations-playground/package.json @@ -0,0 +1,20 @@ +{ + "name": "@example/integrations-playground", + "version": "0.0.1", + "private": true, + "scripts": { + "dev": "astro dev", + "start": "astro dev", + "build": "astro build", + "preview": "astro preview" + }, + "devDependencies": { + "@astrojs/lit": "^0.0.1", + "@astrojs/react": "^0.0.1", + "@astrojs/partytown": "^0.0.1", + "@astrojs/sitemap": "^0.0.1", + "@astrojs/tailwind": "^0.0.1", + "@astrojs/turbolinks": "^0.0.1", + "astro": "^0.24.3" + } +} diff --git a/examples/integrations-playground/public/assets/logo.svg b/examples/integrations-playground/public/assets/logo.svg new file mode 100644 index 000000000..d751556b2 --- /dev/null +++ b/examples/integrations-playground/public/assets/logo.svg @@ -0,0 +1,12 @@ + + + + + + diff --git a/examples/integrations-playground/public/favicon.ico b/examples/integrations-playground/public/favicon.ico new file mode 100644 index 000000000..578ad458b Binary files /dev/null and b/examples/integrations-playground/public/favicon.ico differ diff --git a/examples/integrations-playground/public/robots.txt b/examples/integrations-playground/public/robots.txt new file mode 100644 index 000000000..1f53798bb --- /dev/null +++ b/examples/integrations-playground/public/robots.txt @@ -0,0 +1,2 @@ +User-agent: * +Disallow: / diff --git a/examples/integrations-playground/sandbox.config.json b/examples/integrations-playground/sandbox.config.json new file mode 100644 index 000000000..9178af77d --- /dev/null +++ b/examples/integrations-playground/sandbox.config.json @@ -0,0 +1,11 @@ +{ + "infiniteLoopProtection": true, + "hardReloadOnChange": false, + "view": "browser", + "template": "node", + "container": { + "port": 3000, + "startScript": "start", + "node": "14" + } +} diff --git a/examples/integrations-playground/src/components/Counter.js b/examples/integrations-playground/src/components/Counter.js new file mode 100644 index 000000000..35fa8dbbb --- /dev/null +++ b/examples/integrations-playground/src/components/Counter.js @@ -0,0 +1,34 @@ +import { LitElement, html } from 'lit'; + +export const tagName = 'my-counter'; + +class Counter extends LitElement { + static get properties() { + return { + count: { + type: Number, + }, + }; + } + + constructor() { + super(); + this.count = 0; + } + + increment() { + this.count++; + } + + render() { + return html` +
+

Count: ${this.count}

+ + +
+ `; + } +} + +customElements.define(tagName, Counter); diff --git a/examples/integrations-playground/src/components/Link.jsx b/examples/integrations-playground/src/components/Link.jsx new file mode 100644 index 000000000..2758df130 --- /dev/null +++ b/examples/integrations-playground/src/components/Link.jsx @@ -0,0 +1,3 @@ +export default function Link({ to, text }) { + return {text}; +} diff --git a/examples/integrations-playground/src/components/Lorem.astro b/examples/integrations-playground/src/components/Lorem.astro new file mode 100644 index 000000000..7a3ad924a --- /dev/null +++ b/examples/integrations-playground/src/components/Lorem.astro @@ -0,0 +1,66 @@ +--- +//hey +--- + +

+ Lorem ipsum dolor sit amet, consectetur adipiscing elit. Morbi quam arcu, rhoncus et dui at, volutpat viverra augue. Suspendisse placerat libero tellus, ut consequat ligula + rutrum id. Vestibulum lectus libero, viverra in lacus eget, porttitor tincidunt leo. Integer sit amet turpis et felis fringilla lacinia in id nibh. Proin vitae dapibus odio. + Mauris ornare eget urna id volutpat. Duis tellus nisi, hendrerit id sodales in, rutrum a quam. Proin tempor velit turpis, et tempor lacus sagittis in. Sed congue mauris quis nibh + posuere, nec semper lacus auctor. Morbi sit amet enim sit amet arcu ullamcorper sollicitudin. Donec dignissim posuere tincidunt. Donec ultrices quam nec orci venenatis suscipit. + Maecenas sapien quam, pretium sit amet ullamcorper at, vulputate sit amet urna. Suspendisse potenti. Integer in sapien turpis. Nulla accumsan viverra diam, quis convallis magna + finibus eget. Integer sed eros bibendum, consequat velit sit amet, tincidunt orci. Mauris varius id metus in fringilla. Vestibulum dignissim massa eget erat luctus, ac congue + mauris pellentesque. In et tempor dolor. Cras blandit congue lorem at facilisis. Aenean vel lacinia quam. Pellentesque luctus metus ut scelerisque efficitur. Mauris laoreet + sodales libero eget luctus. Proin at congue dui, a cursus risus. Pellentesque lorem sem, rhoncus fermentum arcu ut, euismod fermentum ligula. Nullam eu orci posuere, laoreet leo + in, commodo dolor. Fusce at felis elementum, commodo justo at, placerat justo. Nam feugiat scelerisque arcu, ut fermentum tellus elementum in. Sed ut vulputate ante. Morbi cursus + arcu quis odio convallis egestas. Donec vulputate vestibulum dolor eget tristique. Nullam tempor semper augue, vitae lobortis neque tempor ac. Pellentesque massa leo, congue id + ligula auctor, sollicitudin pharetra lorem. Curabitur a lacus porttitor, venenatis est quis, mattis velit. Fusce hendrerit lobortis mi ac efficitur. Mauris ornare, lorem sed + varius faucibus, nisi dui pretium urna, sit amet lacinia nibh ligula in ipsum. Phasellus gravida, metus eget ornare ultrices, dolor ipsum consectetur erat, ac aliquet eros metus + sed lectus. Nullam eleifend posuere rhoncus. Curabitur semper ligula vel ante posuere, at blandit orci accumsan. Vivamus accumsan metus in lorem laoreet, a luctus arcu tempus. + Donec posuere sollicitudin nulla at vulputate. Nulla condimentum imperdiet purus, et lobortis ligula iaculis in. Donec suscipit viverra neque, ut elementum eros lacinia ut. Fusce + at odio enim. Donec rutrum lectus sit amet est auctor, ac rhoncus lorem imperdiet. Curabitur commodo ex est, non tempus massa pulvinar nec. Sed fermentum, lectus eget ultricies + luctus, enim sem sodales quam, sed laoreet tortor sem feugiat nisi. Morbi molestie vehicula viverra. Integer accumsan mi in orci ultrices posuere. Integer mi quam, faucibus et + aliquet imperdiet, ornare ac ex. Nunc mattis molestie nisi, eu venenatis nibh vehicula at. Aliquam ut elit consectetur, finibus lorem sed, condimentum sapien. Praesent fermentum + iaculis orci, vitae tincidunt est viverra nec. Morbi semper turpis sed lectus ornare tristique. Sed congue dui ex. Maecenas orci ligula, imperdiet sit amet accumsan et, finibus a + velit. Ut vitae blandit eros. Nam gravida nec ipsum non volutpat. Integer quam metus, porttitor id ante sed, rutrum porta quam. Aenean at mattis ante. Morbi id libero eget risus + sagittis gravida. Proin consequat sapien a dignissim posuere. Ut luctus sed metus ut elementum. Mauris tincidunt condimentum risus at bibendum. Aenean a sapien justo. Morbi vel + neque in eros venenatis scelerisque vitae nec justo. Vestibulum lacinia, dui eu sollicitudin ornare, est elit vestibulum arcu, nec ultrices augue turpis in massa. Duis commodo + lectus sed est posuere, et mollis nisi dapibus. Sed id ultrices arcu. Praesent tempor sodales aliquet. Donec suscipit ipsum eu odio cursus, quis sodales metus sodales. Nunc + vestibulum massa at felis ullamcorper cursus. Pellentesque facilisis ante ut lectus vulputate vestibulum. Nullam pharetra felis ac lacus sodales, vel suscipit metus faucibus. + Donec facilisis imperdiet risus, in volutpat odio tincidunt a. Aliquam vitae leo lorem. Proin scelerisque efficitur velit, vel cursus ipsum accumsan id. Morbi nibh nulla, pretium + quis venenatis et, pharetra et sapien. Cras lobortis, massa sit amet blandit pulvinar, mi magna condimentum ex, quis commodo ipsum est quis metus. Maecenas pulvinar, leo sit amet + congue pulvinar, neque magna ultrices mi, et rhoncus massa sapien quis libero. Etiam a nunc et ipsum faucibus pretium. Nulla facilisi. Nunc nec dolor velit. In semper semper mi + non condimentum. Pellentesque vehicula volutpat odio, a semper sem porta a. In sit amet lectus rutrum, sollicitudin augue auctor, maximus quam. Mauris congue, nisl non fermentum + iaculis, leo erat interdum lorem, quis bibendum arcu eros et elit. Fusce tortor ante, gravida a arcu in, lacinia finibus ante. Phasellus facilisis lectus vitae sapien feugiat + laoreet. Curabitur ultricies libero sit amet condimentum suscipit. Duis at vestibulum mi. Suspendisse at neque augue. Duis ornare a mauris id efficitur. Suspendisse in dui nec + dolor dignissim venenatis. Curabitur a magna turpis. Aliquam at commodo tellus. In id sem interdum, suscipit felis at, mattis velit. Proin accumsan sodales felis a lacinia. + Curabitur at magna a massa varius maximus. Vestibulum in auctor ante. Donec aliquam tortor sed nulla rutrum, et egestas mi efficitur. Sed viverra quam tellus, quis vulputate + felis ultrices sed. Mauris sagittis, neque quis laoreet gravida, nisi est ultrices mi, at tempus nunc justo non dui. Suspendisse porttitor tortor nulla, eget luctus quam finibus + id. Proin sodales eros mollis tellus euismod luctus a eu mi. Quisque consectetur iaculis nibh, at mollis tellus volutpat eu. Aenean a nulla vel lectus rhoncus aliquam. Donec + vitae lacinia neque. Donec non lectus eget sem finibus ultrices vel nec felis. Proin fringilla mi a leo rhoncus aliquam sit amet quis augue. Duis congue ligula at est suscipit + fringilla. Proin aliquam erat ut consequat dapibus. Suspendisse non nisi orci. Donec ac erat vel libero egestas laoreet. Nullam felis odio, tincidunt eget eleifend a, porttitor + eu nisi. Suspendisse tristique eros at dolor scelerisque hendrerit. Etiam id dignissim lectus. Fusce lacinia metus eu risus placerat, et eleifend nunc ultrices. Ut gravida a dui + sed volutpat. Sed semper quis erat sed ornare. Pellentesque sapien sem, fermentum vel nunc at, auctor posuere nisl. Maecenas aliquet lobortis leo. Vivamus tellus urna, dignissim + consectetur sapien vitae, hendrerit varius sem. Nunc dictum tristique fermentum. Duis eu suscipit odio. Curabitur quis egestas neque. Fusce eu fringilla orci, vitae euismod + sapien. Donec sit amet iaculis urna. Phasellus maximus nisl in libero bibendum volutpat. Nulla at vehicula lorem. Phasellus varius, elit ac suscipit pretium, turpis ipsum + porttitor lectus, vitae ullamcorper orci velit ut ligula. Proin mollis, orci vel commodo auctor, sapien ipsum vulputate enim, sit amet aliquam nulla sapien ut sapien. Proin + tincidunt ex non massa aliquet, quis aliquam nulla egestas. Maecenas mollis turpis dapibus, dignissim lectus tincidunt, egestas ligula. Suspendisse in lobortis purus. Sed tellus + tellus, mollis eget tempor sed, interdum ut lectus. Nulla sed ex efficitur, porta dui cursus, tristique elit. Maecenas tincidunt tortor vitae massa laoreet ultricies. Mauris ac + elit vitae orci eleifend ornare non eu ligula. Curabitur venenatis nulla ut neque tristique, non tincidunt justo pretium. Suspendisse mattis semper dui, eget vestibulum risus + elementum sed. In consequat nisi sit amet nulla euismod, at convallis tortor tincidunt. Aliquam hendrerit venenatis risus in interdum. Duis ullamcorper imperdiet elit sit amet + blandit. Mauris placerat lacinia velit id pharetra. Nam nec iaculis dui. Etiam odio mi, fringilla in rutrum in, viverra quis tellus. Aliquam egestas mauris id nisi facilisis, in + laoreet nibh malesuada. Ut eu dui laoreet, venenatis tellus ac, feugiat mauris. Nunc in velit laoreet, venenatis tellus quis, blandit dolor. Nulla ultrices et neque id placerat. + Nulla eu interdum nulla. Aliquam molestie enim quis rutrum finibus. Nulla bibendum orci vel scelerisque posuere. Praesent quis magna molestie, luctus tortor tincidunt, gravida + neque. Quisque et ligula eget magna viverra interdum at a sapien. Mauris ornare efficitur nunc sed vulputate. Praesent laoreet mollis tincidunt. Vestibulum id arcu vulputate, + eleifend enim vel, accumsan turpis. Morbi faucibus convallis tellus, semper laoreet justo lacinia nec. Sed sodales ligula consectetur dui rhoncus, et convallis metus accumsan. + Sed ullamcorper non ex sit amet ultricies. Donec finibus nulla nec blandit porttitor. Etiam aliquam quis leo a imperdiet. Cras at lobortis est. In convallis semper enim, ac porta + ligula fringilla at. Donec augue est, facilisis et odio sit amet, viverra ullamcorper nisl. Ut porta velit nec sem lacinia, sit amet mollis magna auctor. Nulla lobortis lacinia + mauris nec sagittis. Suspendisse rutrum ex vel nisi interdum hendrerit et ut purus. Sed consectetur sodales nibh eget tempus. Aenean egestas luctus viverra. Integer fermentum + tincidunt tellus, nec rhoncus velit hendrerit vitae. Proin quis neque porttitor, scelerisque risus gravida, volutpat sem. Fusce nec ex rhoncus, tempor libero nec, pellentesque + ex. Integer quis iaculis purus. Nullam vitae imperdiet orci. Sed sit amet eros condimentum, scelerisque turpis facilisis, dignissim ante. Proin quis tristique lacus, sed sagittis + nisl. Cras pharetra ultrices purus, sed ullamcorper nisi fringilla eu. Praesent risus turpis, auctor in fringilla a, fringilla eu dolor. Phasellus auctor tristique enim, eleifend + molestie diam venenatis ut. Mauris dapibus, enim eget pharetra semper, nulla dui porttitor mi, auctor hendrerit augue nulla quis urna. Aliquam in cursus justo. +

diff --git a/examples/integrations-playground/src/components/Test.js b/examples/integrations-playground/src/components/Test.js new file mode 100644 index 000000000..7f565f777 --- /dev/null +++ b/examples/integrations-playground/src/components/Test.js @@ -0,0 +1,19 @@ +import { LitElement, html } from 'lit'; + +export const tagName = 'calc-add'; + +class CalcAdd extends LitElement { + static get properties() { + return { + num: { + type: Number, + }, + }; + } + + render() { + return html`
Number: ${this.num}
`; + } +} + +customElements.define(tagName, CalcAdd); diff --git a/examples/integrations-playground/src/pages/foo.astro b/examples/integrations-playground/src/pages/foo.astro new file mode 100644 index 000000000..fbdd5bb1f --- /dev/null +++ b/examples/integrations-playground/src/pages/foo.astro @@ -0,0 +1,15 @@ +--- +// Page 2! +import Link from '../components/Link.jsx'; +--- + + + + + + Demo: Page 2 + + + + + diff --git a/examples/integrations-playground/src/pages/index.astro b/examples/integrations-playground/src/pages/index.astro new file mode 100644 index 000000000..677026072 --- /dev/null +++ b/examples/integrations-playground/src/pages/index.astro @@ -0,0 +1,53 @@ +--- +import Lorem from '../components/Lorem.astro'; +import Link from '../components/Link.jsx'; +import '../components/Test.js'; +import '../components/Counter.js'; +--- + + + + + + Demo + + +

Test app

+

+ Party Mode! + Colors changing = partytown is enabled +

+ + + + + + + + + + + + diff --git a/examples/integrations-playground/tsconfig.json b/examples/integrations-playground/tsconfig.json new file mode 100644 index 000000000..8e881cf9c --- /dev/null +++ b/examples/integrations-playground/tsconfig.json @@ -0,0 +1,5 @@ +{ + "compilerOptions": { + "moduleResolution": "node" + } +} diff --git a/examples/minimal/astro.config.mjs b/examples/minimal/astro.config.mjs index c6e58dbdc..882e6515a 100644 --- a/examples/minimal/astro.config.mjs +++ b/examples/minimal/astro.config.mjs @@ -1,7 +1,4 @@ import { defineConfig } from 'astro/config'; // https://astro.build/config -export default defineConfig({ - // Comment out "renderers: []" to enable Astro's default component support. - renderers: [], -}); +export default defineConfig({}); diff --git a/examples/non-html-pages/astro.config.mjs b/examples/non-html-pages/astro.config.mjs index c6e58dbdc..882e6515a 100644 --- a/examples/non-html-pages/astro.config.mjs +++ b/examples/non-html-pages/astro.config.mjs @@ -1,7 +1,4 @@ import { defineConfig } from 'astro/config'; // https://astro.build/config -export default defineConfig({ - // Comment out "renderers: []" to enable Astro's default component support. - renderers: [], -}); +export default defineConfig({}); diff --git a/examples/portfolio/astro.config.mjs b/examples/portfolio/astro.config.mjs index a024b64b4..f0dab7e31 100644 --- a/examples/portfolio/astro.config.mjs +++ b/examples/portfolio/astro.config.mjs @@ -1,7 +1,7 @@ import { defineConfig } from 'astro/config'; +import preact from '@astrojs/render-preact'; // https://astro.build/config export default defineConfig({ - // Enable the Preact renderer to support Preact JSX components. - renderers: ['@astrojs/renderer-preact'], + integrations: [preact()], }); diff --git a/examples/portfolio/package.json b/examples/portfolio/package.json index bbf074abf..11c7b63ca 100644 --- a/examples/portfolio/package.json +++ b/examples/portfolio/package.json @@ -9,7 +9,7 @@ "preview": "astro preview" }, "devDependencies": { - "@astrojs/renderer-preact": "^0.5.0", + "@astrojs/preact": "^0.0.1", "astro": "^0.24.3", "sass": "^1.49.9" } diff --git a/examples/ssr/astro.config.mjs b/examples/ssr/astro.config.mjs index c8e5061a6..481576db1 100644 --- a/examples/ssr/astro.config.mjs +++ b/examples/ssr/astro.config.mjs @@ -1,7 +1,9 @@ import { defineConfig } from 'astro/config'; +import svelte from '@astrojs/svelte'; +// https://astro.build/config export default defineConfig({ - renderers: ['@astrojs/renderer-svelte'], + integrations: [svelte()], vite: { server: { cors: { diff --git a/examples/ssr/package.json b/examples/ssr/package.json index fe135b832..b454978c8 100644 --- a/examples/ssr/package.json +++ b/examples/ssr/package.json @@ -12,7 +12,7 @@ "server": "node server/server.mjs" }, "devDependencies": { - "@astrojs/renderer-svelte": "^0.5.2", + "@astrojs/svelte": "^0.0.1", "astro": "^0.24.3", "concurrently": "^7.0.0", "lightcookie": "^1.0.25", diff --git a/examples/starter/astro.config.mjs b/examples/starter/astro.config.mjs index f8ad313bc..882e6515a 100644 --- a/examples/starter/astro.config.mjs +++ b/examples/starter/astro.config.mjs @@ -1,7 +1,4 @@ import { defineConfig } from 'astro/config'; // https://astro.build/config -export default defineConfig({ - // Set "renderers" to "[]" to disable all default, builtin component support. - renderers: [], -}); +export default defineConfig({}); diff --git a/examples/subpath/astro.config.mjs b/examples/subpath/astro.config.mjs index 42ecf7db4..bb680d762 100644 --- a/examples/subpath/astro.config.mjs +++ b/examples/subpath/astro.config.mjs @@ -1,10 +1,10 @@ import { defineConfig } from 'astro/config'; +import react from '@astrojs/react'; // https://astro.build/config export default defineConfig({ - // Comment out "renderers: []" to enable Astro's default component support. + integrations: [react()], buildOptions: { site: 'http://example.com/blog', }, - renderers: ['@astrojs/renderer-react'], }); diff --git a/examples/subpath/package.json b/examples/subpath/package.json index aab141e2a..d29f58717 100644 --- a/examples/subpath/package.json +++ b/examples/subpath/package.json @@ -9,7 +9,7 @@ "preview": "astro preview" }, "devDependencies": { - "@astrojs/renderer-react": "^0.5.0", + "@astrojs/react": "^0.0.1", "astro": "^0.24.3", "sass": "^1.49.9" } diff --git a/examples/with-markdown-plugins/astro.config.mjs b/examples/with-markdown-plugins/astro.config.mjs index 26d986ce1..0e112712a 100644 --- a/examples/with-markdown-plugins/astro.config.mjs +++ b/examples/with-markdown-plugins/astro.config.mjs @@ -5,7 +5,6 @@ import addClasses from './add-classes.mjs'; // https://astro.build/config export default defineConfig({ // Enable Custom Markdown options, plugins, etc. - renderers: [], markdownOptions: { render: [ astroRemark, diff --git a/examples/with-markdown-shiki/astro.config.mjs b/examples/with-markdown-shiki/astro.config.mjs index 3e9c52479..7a0b4f0f2 100644 --- a/examples/with-markdown-shiki/astro.config.mjs +++ b/examples/with-markdown-shiki/astro.config.mjs @@ -4,7 +4,6 @@ import astroRemark from '@astrojs/markdown-remark'; // https://astro.build/config export default defineConfig({ // Enable Custom Markdown options, plugins, etc. - renderers: [], markdownOptions: { render: [ astroRemark, diff --git a/examples/with-markdown/astro.config.mjs b/examples/with-markdown/astro.config.mjs index f5069ec18..c5dcad073 100644 --- a/examples/with-markdown/astro.config.mjs +++ b/examples/with-markdown/astro.config.mjs @@ -1,6 +1,11 @@ import { defineConfig } from 'astro/config'; +import preact from '@astrojs/preact'; +import react from '@astrojs/react'; +import svelte from '@astrojs/svelte'; +import vue from '@astrojs/vue'; // https://astro.build/config export default defineConfig({ - renderers: ['@astrojs/renderer-preact', '@astrojs/renderer-react', '@astrojs/renderer-svelte', '@astrojs/renderer-vue'], + // Enable many frameworks to support all different kinds of components. + integrations: [preact(), react(), svelte(), vue()], }); diff --git a/examples/with-markdown/package.json b/examples/with-markdown/package.json index 4979a80fa..739fa896b 100644 --- a/examples/with-markdown/package.json +++ b/examples/with-markdown/package.json @@ -10,10 +10,10 @@ }, "devDependencies": { "@astrojs/markdown-remark": "^0.6.4", - "@astrojs/renderer-preact": "^0.5.0", - "@astrojs/renderer-react": "^0.5.0", - "@astrojs/renderer-svelte": "^0.5.2", - "@astrojs/renderer-vue": "^0.4.0", + "@astrojs/preact": "^0.0.1", + "@astrojs/react": "^0.0.1", + "@astrojs/svelte": "^0.0.1", + "@astrojs/vue": "^0.0.1", "astro": "^0.24.3" } } diff --git a/examples/with-nanostores/astro.config.mjs b/examples/with-nanostores/astro.config.mjs index 90f8b2ca4..4b50887cd 100644 --- a/examples/with-nanostores/astro.config.mjs +++ b/examples/with-nanostores/astro.config.mjs @@ -1,7 +1,12 @@ import { defineConfig } from 'astro/config'; +import preact from '@astrojs/preact'; +import react from '@astrojs/react'; +import svelte from '@astrojs/svelte'; +import vue from '@astrojs/vue'; +import solid from '@astrojs/solid-js'; // https://astro.build/config export default defineConfig({ - // Enable many renderers to support all different kinds of components. - renderers: ['@astrojs/renderer-preact', '@astrojs/renderer-react', '@astrojs/renderer-svelte', '@astrojs/renderer-vue', '@astrojs/renderer-solid'], + // Enable many frameworks to support all different kinds of components. + integrations: [preact(), react(), svelte(), vue(), solid()], }); diff --git a/examples/with-nanostores/package.json b/examples/with-nanostores/package.json index 85b7a4d2a..c41c8b315 100644 --- a/examples/with-nanostores/package.json +++ b/examples/with-nanostores/package.json @@ -20,11 +20,11 @@ "vue": "^3.2.31" }, "devDependencies": { - "@astrojs/renderer-preact": "^0.5.0", - "@astrojs/renderer-react": "^0.5.0", - "@astrojs/renderer-solid": "^0.4.0", - "@astrojs/renderer-svelte": "^0.5.2", - "@astrojs/renderer-vue": "^0.4.0", + "@astrojs/preact": "^0.0.1", + "@astrojs/react": "^0.0.1", + "@astrojs/solid-js": "^0.0.1", + "@astrojs/svelte": "^0.0.1", + "@astrojs/vue": "^0.0.1", "astro": "^0.24.3" } } diff --git a/examples/with-tailwindcss/astro.config.mjs b/examples/with-tailwindcss/astro.config.mjs index a024b64b4..4ad396807 100644 --- a/examples/with-tailwindcss/astro.config.mjs +++ b/examples/with-tailwindcss/astro.config.mjs @@ -1,7 +1,7 @@ import { defineConfig } from 'astro/config'; +import tailwind from '@astrojs/tailwind'; // https://astro.build/config export default defineConfig({ - // Enable the Preact renderer to support Preact JSX components. - renderers: ['@astrojs/renderer-preact'], + integrations: [tailwind()], }); diff --git a/examples/with-tailwindcss/package.json b/examples/with-tailwindcss/package.json index b1060f02e..8e4009f18 100644 --- a/examples/with-tailwindcss/package.json +++ b/examples/with-tailwindcss/package.json @@ -9,9 +9,10 @@ "preview": "astro preview" }, "devDependencies": { - "@astrojs/renderer-preact": "^0.5.0", + "@astrojs/tailwind": "^0.0.1", "astro": "^0.24.3", "autoprefixer": "^10.4.4", + "canvas-confetti": "^1.5.1", "postcss": "^8.4.12", "tailwindcss": "^3.0.23" } diff --git a/examples/with-tailwindcss/postcss.config.js b/examples/with-tailwindcss/postcss.config.js deleted file mode 100644 index c3a002bfe..000000000 --- a/examples/with-tailwindcss/postcss.config.js +++ /dev/null @@ -1,10 +0,0 @@ -const path = require('path'); - -module.exports = { - plugins: { - tailwindcss: { - config: path.join(__dirname, 'tailwind.config.js'), // update this if your path differs! - }, - autoprefixer: {}, - }, -}; diff --git a/examples/with-tailwindcss/src/components/Button.astro b/examples/with-tailwindcss/src/components/Button.astro index 5e241c44f..11c605a2f 100644 --- a/examples/with-tailwindcss/src/components/Button.astro +++ b/examples/with-tailwindcss/src/components/Button.astro @@ -1,10 +1,11 @@ --- -let { type = 'button' } = Astro.props; +// Click button, get confetti! +// Styled by Tailwind :) --- - - + \ No newline at end of file diff --git a/examples/with-tailwindcss/src/pages/index.astro b/examples/with-tailwindcss/src/pages/index.astro index ba346e6c2..743653a95 100644 --- a/examples/with-tailwindcss/src/pages/index.astro +++ b/examples/with-tailwindcss/src/pages/index.astro @@ -1,7 +1,6 @@ --- // Component Imports import Button from '../components/Button.astro'; -import '../styles/global.css'; // Full Astro Component Syntax: // https://docs.astro.build/core-concepts/astro-components/ @@ -15,6 +14,8 @@ import '../styles/global.css'; - +
+ +
diff --git a/examples/with-tailwindcss/tailwind.config.js b/examples/with-tailwindcss/tailwind.config.js deleted file mode 100644 index 30b9aff01..000000000 --- a/examples/with-tailwindcss/tailwind.config.js +++ /dev/null @@ -1,3 +0,0 @@ -module.exports = { - content: ['./src/**/*.{astro,html,js,jsx,svelte,ts,tsx,vue}'], -}; diff --git a/examples/with-vite-plugin-pwa/astro.config.mjs b/examples/with-vite-plugin-pwa/astro.config.mjs index 7f5cebf51..6f95a5633 100644 --- a/examples/with-vite-plugin-pwa/astro.config.mjs +++ b/examples/with-vite-plugin-pwa/astro.config.mjs @@ -3,7 +3,6 @@ import { VitePWA } from 'vite-plugin-pwa'; // https://astro.build/config export default defineConfig({ - renderers: [], vite: { plugins: [VitePWA()], }, diff --git a/package.json b/package.json index 0172ec6a0..743696259 100644 --- a/package.json +++ b/package.json @@ -23,6 +23,7 @@ "compiled/*", "packages/markdown/*", "packages/renderers/*", + "packages/integrations/*", "packages/*", "examples/*", "examples/component/demo", diff --git a/packages/astro/package.json b/packages/astro/package.json index 14df72e25..e3e1e7391 100644 --- a/packages/astro/package.json +++ b/packages/astro/package.json @@ -57,7 +57,7 @@ "dev": "astro-scripts dev \"src/**/*.ts\"", "postbuild": "astro-scripts copy \"src/**/*.astro\"", "benchmark": "node test/benchmark/dev.bench.js && node test/benchmark/build.bench.js", - "test": "mocha --parallel --timeout 20000 --ignore **/lit-element.test.js && mocha --timeout 20000 **/lit-element.test.js", + "test": "mocha --exit --timeout 20000 --ignore **/lit-element.test.js && mocha --timeout 20000 **/lit-element.test.js", "test:match": "mocha --timeout 20000 -g" }, "dependencies": { @@ -65,10 +65,6 @@ "@astrojs/language-server": "^0.8.10", "@astrojs/markdown-remark": "^0.6.4", "@astrojs/prism": "0.4.0", - "@astrojs/renderer-preact": "^0.5.0", - "@astrojs/renderer-react": "0.5.0", - "@astrojs/renderer-svelte": "0.5.2", - "@astrojs/renderer-vue": "0.4.0", "@astrojs/webapi": "^0.11.0", "@babel/core": "^7.17.7", "@babel/traverse": "^7.17.3", diff --git a/packages/astro/src/@types/astro.ts b/packages/astro/src/@types/astro.ts index ce089b7e6..e139faa10 100644 --- a/packages/astro/src/@types/astro.ts +++ b/packages/astro/src/@types/astro.ts @@ -1,9 +1,10 @@ +import type { AddressInfo } from 'net'; import type * as babel from '@babel/core'; +import type * as vite from 'vite'; import type { z } from 'zod'; import type { AstroConfigSchema } from '../core/config'; import type { AstroComponentFactory, Metadata } from '../runtime/server'; import type { AstroRequest } from '../core/render/request'; -import type * as vite from 'vite'; export interface AstroBuiltinProps { 'client:load'?: boolean; @@ -127,21 +128,30 @@ export interface AstroUserConfig { /** * @docs - * @name renderers - * @type {string[]} - * @default `['@astrojs/renderer-svelte','@astrojs/renderer-vue','@astrojs/renderer-react','@astrojs/renderer-preact']` + * @name integrations + * @type {AstroIntegration[]} + * @default `[]` * @description - * Set the UI framework renderers for your project. Framework renderers are what power Astro's ability to use other frameworks inside of your project, like React, Svelte, and Vue. + * Add Integrations to your project to extend Astro. * - * Setting this configuration will disable Astro's default framework support, so you will need to provide a renderer for every framework that you want to use. + * Integrations are your one-stop shop to add new frameworks (like Solid.js), new features (like sitemaps), and new libraries (like Partytown and Turbolinks). + * + * Setting this configuration will disable Astro's default integration, so it is recommended to provide a renderer for every framework that you use: + * + * Note: Integrations are currently under active development, and only first-party integrations are supported. In the future, 3rd-party integrations will be allowed. * * ```js + * import react from '@astrojs/react'; + * import vue from '@astrojs/vue'; * { - * // Use Astro + React, with no other frameworks. - * renderers: ['@astrojs/renderer-react'] + * // Example: Use Astro with Vue + React, and no other frameworks. + * integrations: [react(), vue()] * } * ``` */ + integrations?: AstroIntegration[]; + + /** @deprecated - Use "integrations" instead. Run Astro to learn more about migrating. */ renderers?: string[]; /** @@ -170,6 +180,7 @@ export interface AstroUserConfig { * } * ``` */ + /** Options for rendering markdown content */ markdownOptions?: { render?: MarkdownRenderOptions; }; @@ -379,7 +390,7 @@ export interface AstroUserConfig { /** * @docs - * @name devOptions.vite + * @name vite * @type {vite.UserConfig} * @description * @@ -421,11 +432,33 @@ export interface AstroUserConfig { // export interface AstroUserConfig extends z.input { // } +/** + * IDs for different stages of JS script injection: + * - "before-hydration": Imported client-side, before the hydration script runs. Processed & resolved by Vite. + * - "head-inline": Injected into a script tag in the `` of every page. Not processed or resolved by Vite. + * - "page": Injected into the JavaScript bundle of every page. Processed & resolved by Vite. + * - "page-ssr": Injected into the frontmatter of every Astro page. Processed & resolved by Vite. + */ +type InjectedScriptStage = 'before-hydration' | 'head-inline' | 'page' | 'page-ssr'; + /** * Resolved Astro Config * Config with user settings along with all defaults filled in. */ -export type AstroConfig = z.output; +export interface AstroConfig extends z.output { + // Public: + // This is a more detailed type than zod validation gives us. + // TypeScript still confirms zod validation matches this type. + integrations: AstroIntegration[]; + // Private: + // We have a need to pass context based on configured state, + // that is different from the user-exposed configuration. + // TODO: Create an AstroConfig class to manage this, long-term. + _ctx: { + renderers: AstroRenderer[]; + scripts: { stage: InjectedScriptStage; content: string }[]; + }; +} export type AsyncRendererComponentFn = (Component: any, props: any, children: string | undefined, metadata?: AstroComponentMetadata) => Promise; @@ -560,38 +593,51 @@ export interface EndpointHandler { [method: string]: (params: any, request: AstroRequest) => EndpointOutput | Response; } -/** - * Astro Renderer - * Docs: https://docs.astro.build/reference/renderer-reference/ - */ -export interface Renderer { - /** Name of the renderer (required) */ +export interface AstroRenderer { + /** Name of the renderer. */ name: string; - /** Import statement for renderer */ - source?: string; - /** Import statement for the server renderer */ - serverEntry: string; - /** Scripts to be injected before component */ - polyfills?: string[]; - /** Polyfills that need to run before hydration ever occurs */ - hydrationPolyfills?: string[]; + /** Import entrypoint for the client/browser renderer. */ + clientEntrypoint?: string; + /** Import entrypoint for the server/build/ssr renderer. */ + serverEntrypoint: string; /** JSX identifier (e.g. 'react' or 'solid-js') */ jsxImportSource?: string; /** Babel transform options */ jsxTransformOptions?: JSXTransformFn; - /** Utilies for server-side rendering */ +} + +export interface SSRLoadedRenderer extends AstroRenderer { ssr: { check: AsyncRendererComponentFn; renderToStaticMarkup: AsyncRendererComponentFn<{ html: string; }>; }; - /** Return configuration object for Vite ("options" should match https://vitejs.dev/guide/api-plugin.html#config) */ - viteConfig?: (options: { mode: 'string'; command: 'build' | 'serve' }) => Promise; - /** @deprecated Don’t try and build these dependencies for client (deprecated in 0.21) */ - external?: string[]; - /** @deprecated Clientside requirements (deprecated in 0.21) */ - knownEntrypoints?: string[]; +} + +export interface AstroIntegration { + /** The name of the integration. */ + name: string; + /** The different hooks available to extend. */ + hooks: { + 'astro:config:setup'?: (options: { + config: AstroConfig; + command: 'dev' | 'build'; + updateConfig: (newConfig: Record) => void; + addRenderer: (renderer: AstroRenderer) => void; + injectScript: (stage: InjectedScriptStage, content: string) => void; + // TODO: Add support for `injectElement()` for full HTML element injection, not just scripts. + // This may require some refactoring of `scripts`, `styles`, and `links` into something + // more generalized. Consider the SSR use-case as well. + // injectElement: (stage: vite.HtmlTagDescriptor, element: string) => void; + }) => void; + 'astro:config:done'?: (options: { config: AstroConfig }) => void | Promise; + 'astro:server:setup'?: (options: { server: vite.ViteDevServer }) => void | Promise; + 'astro:server:start'?: (options: { address: AddressInfo }) => void | Promise; + 'astro:server:done'?: () => void | Promise; + 'astro:build:start'?: () => void | Promise; + 'astro:build:done'?: (options: { pages: { pathname: string }[]; dir: URL }) => void | Promise; + }; } export type RouteType = 'page' | 'endpoint'; @@ -665,7 +711,7 @@ export interface SSRElement { } export interface SSRMetadata { - renderers: Renderer[]; + renderers: SSRLoadedRenderer[]; pathname: string; legacyBuild: boolean; } diff --git a/packages/astro/src/core/app/index.ts b/packages/astro/src/core/app/index.ts index fab55c9af..c05b713ab 100644 --- a/packages/astro/src/core/app/index.ts +++ b/packages/astro/src/core/app/index.ts @@ -1,4 +1,4 @@ -import type { ComponentInstance, ManifestData, RouteData, Renderer } from '../../@types/astro'; +import type { ComponentInstance, ManifestData, RouteData, SSRLoadedRenderer } from '../../@types/astro'; import type { SSRManifest as Manifest, RouteInfo } from './types'; import { defaultLogOptions } from '../logger.js'; @@ -6,7 +6,6 @@ import { matchRoute } from '../routing/match.js'; import { render } from '../render/core.js'; import { RouteCache } from '../render/route-cache.js'; import { createLinkStylesheetElementSet, createModuleScriptElementWithSrcSet } from '../render/ssr-element.js'; -import { createRenderer } from '../render/renderer.js'; import { prependForwardSlash } from '../path.js'; export class App { @@ -15,7 +14,7 @@ export class App { #rootFolder: URL; #routeDataToRouteInfo: Map; #routeCache: RouteCache; - #renderersPromise: Promise; + #renderersPromise: Promise; constructor(manifest: Manifest, rootFolder: URL) { this.#manifest = manifest; @@ -84,18 +83,11 @@ export class App { status: 200, }); } - async #loadRenderers(): Promise { - const rendererNames = this.#manifest.renderers; + async #loadRenderers(): Promise { return await Promise.all( - rendererNames.map(async (rendererName) => { - return createRenderer(rendererName, { - renderer(name) { - return import(name); - }, - server(entry) { - return import(entry); - }, - }); + this.#manifest.renderers.map(async (renderer) => { + const mod = (await import(renderer.serverEntrypoint)) as { default: SSRLoadedRenderer['ssr'] }; + return { ...renderer, ssr: mod.default }; }) ); } diff --git a/packages/astro/src/core/app/types.ts b/packages/astro/src/core/app/types.ts index 612a60ad6..d78a94050 100644 --- a/packages/astro/src/core/app/types.ts +++ b/packages/astro/src/core/app/types.ts @@ -1,4 +1,4 @@ -import type { RouteData, SerializedRouteData, MarkdownRenderOptions } from '../../@types/astro'; +import type { RouteData, SerializedRouteData, MarkdownRenderOptions, AstroRenderer } from '../../@types/astro'; export interface RouteInfo { routeData: RouteData; @@ -17,7 +17,7 @@ export interface SSRManifest { markdown: { render: MarkdownRenderOptions; }; - renderers: string[]; + renderers: AstroRenderer[]; entryModules: Record; } diff --git a/packages/astro/src/core/build/index.ts b/packages/astro/src/core/build/index.ts index db06851d2..8996fc559 100644 --- a/packages/astro/src/core/build/index.ts +++ b/packages/astro/src/core/build/index.ts @@ -14,6 +14,7 @@ import { collectPagesData } from './page-data.js'; import { build as scanBasedBuild } from './scan-based-build.js'; import { staticBuild } from './static-build.js'; import { RouteCache } from '../render/route-cache.js'; +import { runHookBuildDone, runHookBuildStart, runHookConfigDone, runHookConfigSetup } from '../../integrations/index.js'; export interface BuildOptions { mode?: string; @@ -57,23 +58,23 @@ class AstroBuilder { const timer: Record = {}; timer.init = performance.now(); timer.viteStart = performance.now(); + this.config = await runHookConfigSetup({ config: this.config, command: 'build' }); const viteConfig = await createVite( - vite.mergeConfig( - { - mode: this.mode, - server: { - hmr: false, - middlewareMode: 'ssr', - }, + { + mode: this.mode, + server: { + hmr: false, + middlewareMode: 'ssr', }, - this.config.vite || {} - ), + }, { astroConfig: this.config, logging, mode: 'build' } ); + await runHookConfigDone({ config: this.config }); this.viteConfig = viteConfig; const viteServer = await vite.createServer(viteConfig); this.viteServer = viteServer; debug('build', timerMessage('Vite started', timer.viteStart)); + await runHookBuildStart({ config: this.config }); timer.loadStart = performance.now(); const { assets, allPages } = await collectPagesData({ @@ -160,6 +161,8 @@ class AstroBuilder { // You're done! Time to clean up. await viteServer.close(); + await runHookBuildDone({ config: this.config, pages: pageNames }); + if (logging.level && levels[logging.level] <= levels['info']) { await this.printStats({ logging, timeStart: timer.init, pageCount: pageNames.length }); } diff --git a/packages/astro/src/core/build/static-build.ts b/packages/astro/src/core/build/static-build.ts index 3c75435a7..36a3af840 100644 --- a/packages/astro/src/core/build/static-build.ts +++ b/packages/astro/src/core/build/static-build.ts @@ -1,31 +1,28 @@ -import type { OutputChunk, OutputAsset, RollupOutput } from 'rollup'; -import type { Plugin as VitePlugin, UserConfig, Manifest as ViteManifest } from 'vite'; -import type { AstroConfig, ComponentInstance, EndpointHandler, ManifestData, Renderer, RouteType } from '../../@types/astro'; -import type { AllPagesData } from './types'; -import type { LogOptions } from '../logger'; -import type { ViteConfigWithSSR } from '../create-vite'; -import type { PageBuildData } from './types'; -import type { BuildInternals } from '../../core/build/internal.js'; -import type { RenderOptions } from '../../core/render/core'; -import type { SerializedSSRManifest, SerializedRouteInfo } from '../app/types'; - +import glob from 'fast-glob'; import fs from 'fs'; import npath from 'path'; +import type { OutputAsset, OutputChunk, RollupOutput } from 'rollup'; import { fileURLToPath } from 'url'; -import glob from 'fast-glob'; +import type { Manifest as ViteManifest, Plugin as VitePlugin, UserConfig } from 'vite'; import * as vite from 'vite'; -import { debug, error } from '../../core/logger.js'; -import { prependForwardSlash, appendForwardSlash } from '../../core/path.js'; -import { emptyDir, removeDir, resolveDependency } from '../../core/util.js'; +import type { AstroConfig, AstroRenderer, ComponentInstance, EndpointHandler, ManifestData, RouteType, SSRLoadedRenderer } from '../../@types/astro'; +import type { BuildInternals } from '../../core/build/internal.js'; import { createBuildInternals } from '../../core/build/internal.js'; +import { debug, error } from '../../core/logger.js'; +import { appendForwardSlash, prependForwardSlash } from '../../core/path.js'; +import type { RenderOptions } from '../../core/render/core'; +import { emptyDir, removeDir, resolveDependency } from '../../core/util.js'; import { rollupPluginAstroBuildCSS } from '../../vite-plugin-build-css/index.js'; -import { vitePluginHoistedScripts } from './vite-plugin-hoisted-scripts.js'; -import { RouteCache } from '../render/route-cache.js'; +import type { SerializedRouteInfo, SerializedSSRManifest } from '../app/types'; +import type { ViteConfigWithSSR } from '../create-vite'; import { call as callEndpoint } from '../endpoint/index.js'; -import { serializeRouteData } from '../routing/index.js'; +import type { LogOptions } from '../logger'; import { render } from '../render/core.js'; +import { RouteCache } from '../render/route-cache.js'; import { createLinkStylesheetElementSet, createModuleScriptElementWithSrcSet } from '../render/ssr-element.js'; -import { createRequest } from '../render/request.js'; +import { serializeRouteData } from '../routing/index.js'; +import type { AllPagesData, PageBuildData } from './types'; +import { vitePluginHoistedScripts } from './vite-plugin-hoisted-scripts.js'; export interface StaticBuildOptions { allPages: AllPagesData; @@ -116,17 +113,8 @@ export async function staticBuild(opts: StaticBuildOptions) { // about that page, such as its paths. const facadeIdToPageDataMap = new Map(); - // Collects polyfills and passes them as top-level inputs - const polyfills = getRenderers(opts).flatMap((renderer) => { - return (renderer.polyfills || []).concat(renderer.hydrationPolyfills || []); - }); - for (const polyfill of polyfills) { - jsInput.add(polyfill); - } - // Build internals needed by the CSS plugin const internals = createBuildInternals(); - for (const [component, pageData] of Object.entries(allPages)) { const astroModuleURL = new URL('./' + component, astroConfig.projectRoot); const astroModuleId = prependForwardSlash(component); @@ -145,7 +133,7 @@ export async function staticBuild(opts: StaticBuildOptions) { // Any hydration directive like astro/client/idle.js ...metadata.hydrationDirectiveSpecifiers(), // The client path for each renderer - ...renderers.filter((renderer) => !!renderer.source).map((renderer) => renderer.source!), + ...renderers.filter((renderer) => !!renderer.clientEntrypoint).map((renderer) => renderer.clientEntrypoint!), ]); // Add hoisted scripts @@ -172,6 +160,7 @@ export async function staticBuild(opts: StaticBuildOptions) { // Build your project (SSR application code, assets, client JS, etc.) const ssrResult = (await ssrBuild(opts, internals, pageInput)) as RollupOutput; + await clientBuild(opts, internals, jsInput); // SSG mode, generate pages. @@ -189,10 +178,11 @@ async function ssrBuild(opts: StaticBuildOptions, internals: BuildInternals, inp const { astroConfig, viteConfig } = opts; const ssr = astroConfig.buildOptions.experimentalSsr; const out = ssr ? getServerRoot(astroConfig) : getOutRoot(astroConfig); - + // TODO: use vite.mergeConfig() here? return await vite.build({ - logLevel: 'warn', + logLevel: 'error', mode: 'production', + css: viteConfig.css, build: { ...viteConfig.build, emptyOutDir: false, @@ -200,6 +190,9 @@ async function ssrBuild(opts: StaticBuildOptions, internals: BuildInternals, inp outDir: fileURLToPath(out), ssr: true, rollupOptions: { + // onwarn(warn) { + // console.log(warn); + // }, input: Array.from(input), output: { format: 'esm', @@ -240,9 +233,12 @@ async function clientBuild(opts: StaticBuildOptions, internals: BuildInternals, } const out = astroConfig.buildOptions.experimentalSsr ? getClientRoot(astroConfig) : getOutRoot(astroConfig); + + // TODO: use vite.mergeConfig() here? return await vite.build({ - logLevel: 'warn', + logLevel: 'error', mode: 'production', + css: viteConfig.css, build: { emptyOutDir: false, minify: 'esbuild', @@ -275,38 +271,20 @@ async function clientBuild(opts: StaticBuildOptions, internals: BuildInternals, }); } -function getRenderers(opts: StaticBuildOptions) { - // All of the PageDatas have the same renderers, so just grab one. - const pageData = Object.values(opts.allPages)[0]; - // These renderers have been loaded through Vite. To generate pages - // we need the ESM loaded version. This creates that. - const viteLoadedRenderers = pageData.preload[0]; - - return viteLoadedRenderers; +async function loadRenderer(renderer: AstroRenderer, config: AstroConfig): Promise { + const mod = (await import(resolveDependency(renderer.serverEntrypoint, config))) as { default: SSRLoadedRenderer['ssr'] }; + return { ...renderer, ssr: mod.default }; } -async function collectRenderers(opts: StaticBuildOptions): Promise { - const viteLoadedRenderers = getRenderers(opts); - - const renderers = await Promise.all( - viteLoadedRenderers.map(async (r) => { - const mod = await import(resolveDependency(r.serverEntry, opts.astroConfig)); - return Object.create(r, { - ssr: { - value: mod.default, - }, - }) as Renderer; - }) - ); - - return renderers; +async function loadRenderers(config: AstroConfig): Promise { + return Promise.all(config._ctx.renderers.map((r) => loadRenderer(r, config))); } async function generatePages(result: RollupOutput, opts: StaticBuildOptions, internals: BuildInternals, facadeIdToPageDataMap: Map) { debug('build', 'Finish build. Begin generating.'); // Get renderers to be shared for each page generation. - const renderers = await collectRenderers(opts); + const renderers = await loadRenderers(opts.astroConfig); for (let output of result.output) { if (chunkIsPage(opts.astroConfig, output, internals)) { @@ -315,7 +293,13 @@ async function generatePages(result: RollupOutput, opts: StaticBuildOptions, int } } -async function generatePage(output: OutputChunk, opts: StaticBuildOptions, internals: BuildInternals, facadeIdToPageDataMap: Map, renderers: Renderer[]) { +async function generatePage( + output: OutputChunk, + opts: StaticBuildOptions, + internals: BuildInternals, + facadeIdToPageDataMap: Map, + renderers: SSRLoadedRenderer[] +) { const { astroConfig } = opts; let url = new URL('./' + output.fileName, getOutRoot(astroConfig)); @@ -359,7 +343,7 @@ interface GeneratePathOptions { linkIds: string[]; hoistedId: string | null; mod: ComponentInstance; - renderers: Renderer[]; + renderers: SSRLoadedRenderer[]; } async function generatePath(pathname: string, opts: StaticBuildOptions, gopts: GeneratePathOptions) { @@ -377,6 +361,16 @@ async function generatePath(pathname: string, opts: StaticBuildOptions, gopts: G const links = createLinkStylesheetElementSet(linkIds.reverse(), site); const scripts = createModuleScriptElementWithSrcSet(hoistedId ? [hoistedId] : [], site); + // Add all injected scripts to the page. + for (const script of astroConfig._ctx.scripts) { + if (script.stage === 'head-inline') { + scripts.add({ + props: {}, + children: script.content, + }); + } + } + try { const options: RenderOptions = { legacyBuild: false, @@ -391,6 +385,14 @@ async function generatePath(pathname: string, opts: StaticBuildOptions, gopts: G async resolve(specifier: string) { const hashedFilePath = internals.entrySpecifierToBundleMap.get(specifier); if (typeof hashedFilePath !== 'string') { + // If no "astro:scripts/before-hydration.js" script exists in the build, + // then we can assume that no before-hydration scripts are needed. + // Return this as placeholder, which will be ignored by the browser. + // TODO: In the future, we hope to run this entire script through Vite, + // removing the need to maintain our own custom Vite-mimic resolve logic. + if (specifier === 'astro:scripts/before-hydration.js') { + return 'data:text/javascript;charset=utf-8,//[no before-hydration script]'; + } throw new Error(`Cannot find the built path for ${specifier}`); } const relPath = npath.posix.relative(pathname, '/' + hashedFilePath); @@ -480,7 +482,7 @@ async function generateManifest(result: RollupOutput, opts: StaticBuildOptions, markdown: { render: astroConfig.markdownOptions.render, }, - renderers: astroConfig.renderers, + renderers: astroConfig._ctx.renderers, entryModules: Object.fromEntries(internals.entrySpecifierToBundleMap.entries()), }; @@ -628,8 +630,8 @@ export function vitePluginNewBuild(input: Set, internals: BuildInternals } await Promise.all(promises); for (const [, chunk] of Object.entries(bundle)) { - if (chunk.type === 'chunk' && chunk.facadeModuleId && mapping.has(chunk.facadeModuleId)) { - const specifier = mapping.get(chunk.facadeModuleId)!; + if (chunk.type === 'chunk' && chunk.facadeModuleId) { + const specifier = mapping.get(chunk.facadeModuleId) || chunk.facadeModuleId; internals.entrySpecifierToBundleMap.set(specifier, chunk.fileName); } } diff --git a/packages/astro/src/core/config.ts b/packages/astro/src/core/config.ts index 5400a9514..6419ab27a 100644 --- a/packages/astro/src/core/config.ts +++ b/packages/astro/src/core/config.ts @@ -1,15 +1,48 @@ import type { AstroConfig, AstroUserConfig, CLIFlags } from '../@types/astro'; import type { Arguments as Flags } from 'yargs-parser'; +import type * as Postcss from 'postcss'; import * as colors from 'kleur/colors'; import path from 'path'; import { pathToFileURL, fileURLToPath } from 'url'; +import { mergeConfig as mergeViteConfig } from 'vite'; import { z } from 'zod'; import load from '@proload/core'; import loadTypeScript from '@proload/plugin-tsm'; +import postcssrc from 'postcss-load-config'; +import { arraify, isObject } from './util.js'; load.use([loadTypeScript]); +interface PostCSSConfigResult { + options: Postcss.ProcessOptions; + plugins: Postcss.Plugin[]; +} + +async function resolvePostcssConfig(inlineOptions: any, root: URL): Promise { + if (isObject(inlineOptions)) { + const options = { ...inlineOptions }; + delete options.plugins; + return { + options, + plugins: inlineOptions.plugins || [], + }; + } + const searchPath = typeof inlineOptions === 'string' ? inlineOptions : fileURLToPath(root); + try { + // @ts-ignore + return await postcssrc({}, searchPath); + } catch (err: any) { + if (!/No PostCSS Config found/.test(err.message)) { + throw err; + } + return { + options: {}, + plugins: [], + }; + } +} + export const AstroConfigSchema = z.object({ projectRoot: z .string() @@ -36,7 +69,31 @@ export const AstroConfigSchema = z.object({ .optional() .default('./dist') .transform((val) => new URL(val)), - renderers: z.array(z.string()).optional().default(['@astrojs/renderer-svelte', '@astrojs/renderer-vue', '@astrojs/renderer-react', '@astrojs/renderer-preact']), + integrations: z.preprocess( + // preprocess + (val) => (Array.isArray(val) ? val.flat(Infinity).filter(Boolean) : val), + // validate + z + .array(z.object({ name: z.string(), hooks: z.object({}).passthrough().default({}) })) + .default([]) + // validate: first-party integrations only + // TODO: Add `To use 3rd-party integrations or to create your own, use the --experimental-integrations flag.`, + .refine((arr) => arr.every((integration) => integration.name.startsWith('@astrojs/')), { + message: `Astro integrations are still experimental, and only official integrations are currently supported`, + }) + ), + styleOptions: z + .object({ + postcss: z + .object({ + options: z.any(), + plugins: z.array(z.any()), + }) + .optional() + .default({ options: {}, plugins: [] }), + }) + .optional() + .default({}), markdownOptions: z .object({ render: z.any().optional().default(['@astrojs/markdown-remark', {}]), @@ -81,6 +138,37 @@ export const AstroConfigSchema = z.object({ /** Turn raw config values into normalized values */ export async function validateConfig(userConfig: any, root: string): Promise { const fileProtocolRoot = pathToFileURL(root + path.sep); + // Manual deprecation checks + /* eslint-disable no-console */ + if (userConfig.hasOwnProperty('renderers')) { + console.error('Astro "renderers" are now "integrations"!'); + console.error('Update your configuration and install new dependencies:'); + try { + const rendererKeywords = userConfig.renderers.map((r: string) => r.replace('@astrojs/renderer-', '')); + const rendererImports = rendererKeywords.map((r: string) => ` import ${r} from '@astrojs/${r}';`).join('\n'); + const rendererIntegrations = rendererKeywords.map((r: string) => ` ${r}(),`).join('\n'); + console.error(''); + console.error(colors.dim(' // astro.config.js')); + if (rendererImports.length > 0) { + console.error(colors.green(rendererImports)); + } + console.error(''); + console.error(colors.dim(' // ...')); + if (rendererIntegrations.length > 0) { + console.error(colors.green(' integrations: [')); + console.error(colors.green(rendererIntegrations)); + console.error(colors.green(' ],')); + } else { + console.error(colors.green(' integrations: [],')); + } + console.error(''); + } catch (err) { + // We tried, better to just exit. + } + process.exit(1); + } + /* eslint-enable no-console */ + // We need to extend the global schema to add transforms that are relative to root. // This is type checked against the global schema to make sure we still match. const AstroConfigRelativeSchema = AstroConfigSchema.extend({ @@ -104,8 +192,26 @@ export async function validateConfig(userConfig: any, root: string): Promise new URL(addTrailingSlash(val), fileProtocolRoot)), + styleOptions: z + .object({ + postcss: z.preprocess( + (val) => resolvePostcssConfig(val, fileProtocolRoot), + z + .object({ + options: z.any(), + plugins: z.array(z.any()), + }) + .optional() + .default({ options: {}, plugins: [] }) + ), + }) + .optional() + .default({}), }); - return AstroConfigRelativeSchema.parseAsync(userConfig); + return { + ...(await AstroConfigRelativeSchema.parseAsync(userConfig)), + _ctx: { scripts: [], renderers: [] }, + }; } /** Adds '/' to end of string but doesn’t double-up */ @@ -175,7 +281,11 @@ export async function loadConfig(configOptions: LoadConfigOptions): Promise { const mergedConfig = mergeCLIFlags(userConfig, flags); const validatedConfig = await validateConfig(mergedConfig, root); return validatedConfig; @@ -185,3 +295,42 @@ export function formatConfigError(err: z.ZodError) { const errorList = err.issues.map((issue) => ` ! ${colors.bold(issue.path.join('.'))} ${colors.red(issue.message + '.')}`); return `${colors.red('[config]')} Astro found issue(s) with your configuration:\n${errorList.join('\n')}`; } + +function mergeConfigRecursively(defaults: Record, overrides: Record, rootPath: string) { + const merged: Record = { ...defaults }; + for (const key in overrides) { + const value = overrides[key]; + if (value == null) { + continue; + } + + const existing = merged[key]; + + if (existing == null) { + merged[key] = value; + continue; + } + + // fields that require special handling: + if (key === 'vite' && rootPath === '') { + merged[key] = mergeViteConfig(existing, value); + continue; + } + + if (Array.isArray(existing) || Array.isArray(value)) { + merged[key] = [...arraify(existing ?? []), ...arraify(value ?? [])]; + continue; + } + if (isObject(existing) && isObject(value)) { + merged[key] = mergeConfigRecursively(existing, value, rootPath ? `${rootPath}.${key}` : key); + continue; + } + + merged[key] = value; + } + return merged; +} + +export function mergeConfig(defaults: Record, overrides: Record, isRoot = true): Record { + return mergeConfigRecursively(defaults, overrides, isRoot ? '' : '.'); +} diff --git a/packages/astro/src/core/create-vite.ts b/packages/astro/src/core/create-vite.ts index b605d063c..65cf269b7 100644 --- a/packages/astro/src/core/create-vite.ts +++ b/packages/astro/src/core/create-vite.ts @@ -5,6 +5,7 @@ import { builtinModules } from 'module'; import { fileURLToPath } from 'url'; import fs from 'fs'; import * as vite from 'vite'; +import { runHookServerSetup } from '../integrations/index.js'; import astroVitePlugin from '../vite-plugin-astro/index.js'; import astroViteServerPlugin from '../vite-plugin-astro-server/index.js'; import astroPostprocessVitePlugin from '../vite-plugin-astro-postprocess/index.js'; @@ -12,7 +13,8 @@ import configAliasVitePlugin from '../vite-plugin-config-alias/index.js'; import markdownVitePlugin from '../vite-plugin-markdown/index.js'; import jsxVitePlugin from '../vite-plugin-jsx/index.js'; import envVitePlugin from '../vite-plugin-env/index.js'; -import { resolveDependency } from './util.js'; +import astroScriptsPlugin from '../vite-plugin-scripts/index.js'; +import astroIntegrationsContainerPlugin from '../vite-plugin-integrations-container/index.js'; // Some packages are just external, and that’s the way it goes. const ALWAYS_EXTERNAL = new Set([ @@ -41,12 +43,11 @@ interface CreateViteOptions { } /** Return a common starting point for all Vite actions */ -export async function createVite(inlineConfig: ViteConfigWithSSR, { astroConfig, logging, mode }: CreateViteOptions): Promise { +export async function createVite(commandConfig: ViteConfigWithSSR, { astroConfig, logging, mode }: CreateViteOptions): Promise { // Scan for any third-party Astro packages. Vite needs these to be passed to `ssr.noExternal`. const astroPackages = await getAstroPackages(astroConfig); - // Start with the Vite configuration that Astro core needs - let viteConfig: ViteConfigWithSSR = { + const commonConfig: ViteConfigWithSSR = { cacheDir: fileURLToPath(new URL('./node_modules/.vite/', astroConfig.projectRoot)), // using local caches allows Astro to be used in monorepos, etc. clearScreen: false, // we want to control the output, not Vite logLevel: 'warn', // log warnings and errors only @@ -56,6 +57,7 @@ export async function createVite(inlineConfig: ViteConfigWithSSR, { astroConfig, plugins: [ configAliasVitePlugin({ config: astroConfig }), astroVitePlugin({ config: astroConfig, logging }), + astroScriptsPlugin({ config: astroConfig }), // The server plugin is for dev only and having it run during the build causes // the build to run very slow as the filewatcher is triggered often. mode === 'dev' && astroViteServerPlugin({ config: astroConfig, logging }), @@ -63,6 +65,7 @@ export async function createVite(inlineConfig: ViteConfigWithSSR, { astroConfig, markdownVitePlugin({ config: astroConfig }), jsxVitePlugin({ config: astroConfig, logging }), astroPostprocessVitePlugin({ config: astroConfig }), + astroIntegrationsContainerPlugin({ config: astroConfig }), ], publicDir: fileURLToPath(astroConfig.public), root: fileURLToPath(astroConfig.projectRoot), @@ -75,6 +78,9 @@ export async function createVite(inlineConfig: ViteConfigWithSSR, { astroConfig, // add proxies here }, }, + css: { + postcss: astroConfig.styleOptions.postcss || {}, + }, // Note: SSR API is in beta (https://vitejs.dev/guide/ssr.html) ssr: { external: [...ALWAYS_EXTERNAL], @@ -82,26 +88,16 @@ export async function createVite(inlineConfig: ViteConfigWithSSR, { astroConfig, }, }; - // Add in Astro renderers, which will extend the base config - for (const name of astroConfig.renderers) { - try { - const { default: renderer } = await import(resolveDependency(name, astroConfig)); - if (!renderer) continue; - // if a renderer provides viteConfig(), call it and pass in results - if (renderer.viteConfig) { - if (typeof renderer.viteConfig !== 'function') { - throw new Error(`${name}: viteConfig(options) must be a function! Got ${typeof renderer.viteConfig}.`); - } - const rendererConfig = await renderer.viteConfig({ mode: inlineConfig.mode, command: inlineConfig.mode === 'production' ? 'build' : 'serve' }); // is this command true? - viteConfig = vite.mergeConfig(viteConfig, rendererConfig) as ViteConfigWithSSR; - } - } catch (err) { - throw new Error(`${name}: ${err}`); - } - } - - viteConfig = vite.mergeConfig(viteConfig, inlineConfig); // merge in inline Vite config - return viteConfig; + // Merge configs: we merge vite configuration objects together in the following order, + // where future values will override previous values. + // 1. common vite config + // 2. user-provided vite config, via AstroConfig + // 3. integration-provided vite config, via the `config:setup` hook + // 4. command vite config, passed as the argument to this function + let result = commonConfig; + result = vite.mergeConfig(result, astroConfig.vite || {}); + result = vite.mergeConfig(result, commandConfig); + return result; } // Scans `projectRoot` for third-party Astro packages that could export an `.astro` file diff --git a/packages/astro/src/core/dev/index.ts b/packages/astro/src/core/dev/index.ts index be3a7ef7f..ca34b0b15 100644 --- a/packages/astro/src/core/dev/index.ts +++ b/packages/astro/src/core/dev/index.ts @@ -1,12 +1,12 @@ -import type { AstroConfig } from '../../@types/astro'; import type { AddressInfo } from 'net'; - import { performance } from 'perf_hooks'; -import { apply as applyPolyfill } from '../polyfill.js'; -import { createVite } from '../create-vite.js'; -import { defaultLogOptions, info, warn, LogOptions } from '../logger.js'; import * as vite from 'vite'; +import type { AstroConfig } from '../../@types/astro'; +import { runHookConfigDone, runHookConfigSetup, runHookServerDone, runHookServerSetup, runHookServerStart } from '../../integrations/index.js'; +import { createVite } from '../create-vite.js'; +import { defaultLogOptions, info, LogOptions, warn } from '../logger.js'; import * as msg from '../messages.js'; +import { apply as applyPolyfill } from '../polyfill.js'; import { getResolvedHostForVite } from './util.js'; export interface DevOptions { @@ -22,31 +22,36 @@ export interface DevServer { export default async function dev(config: AstroConfig, options: DevOptions = { logging: defaultLogOptions }): Promise { const devStart = performance.now(); applyPolyfill(); - - // TODO: remove call once --hostname is baselined - const host = getResolvedHostForVite(config); - const viteUserConfig = vite.mergeConfig( + config = await runHookConfigSetup({ config, command: 'dev' }); + const viteConfig = await createVite( { mode: 'development', - server: { host }, + // TODO: remove call once --hostname is baselined + server: { host: getResolvedHostForVite(config) }, }, - config.vite || {} + { astroConfig: config, logging: options.logging, mode: 'dev' } ); - const viteConfig = await createVite(viteUserConfig, { astroConfig: config, logging: options.logging, mode: 'dev' }); + await runHookConfigDone({ config }); const viteServer = await vite.createServer(viteConfig); + runHookServerSetup({ config, server: viteServer }); await viteServer.listen(config.devOptions.port); const devServerAddressInfo = viteServer.httpServer!.address() as AddressInfo; const site = config.buildOptions.site ? new URL(config.buildOptions.site) : undefined; - info(options.logging, null, msg.devStart({ startupTime: performance.now() - devStart, config, devServerAddressInfo, site, https: !!viteUserConfig.server?.https })); + info(options.logging, null, msg.devStart({ startupTime: performance.now() - devStart, config, devServerAddressInfo, site, https: !!viteConfig.server?.https })); const currentVersion = process.env.PACKAGE_VERSION ?? '0.0.0'; if (currentVersion.includes('-')) { warn(options.logging, null, msg.prerelease({ currentVersion })); } + await runHookServerStart({ config, address: devServerAddressInfo }); + return { address: devServerAddressInfo, - stop: () => viteServer.close(), + stop: async () => { + await viteServer.close(); + await runHookServerDone({ config }); + }, }; } diff --git a/packages/astro/src/core/render/core.ts b/packages/astro/src/core/render/core.ts index 40d28abcd..a1ea94f65 100644 --- a/packages/astro/src/core/render/core.ts +++ b/packages/astro/src/core/render/core.ts @@ -1,4 +1,4 @@ -import type { ComponentInstance, EndpointHandler, MarkdownRenderOptions, Params, Props, Renderer, RouteData, SSRElement } from '../../@types/astro'; +import type { ComponentInstance, EndpointHandler, MarkdownRenderOptions, Params, Props, SSRLoadedRenderer, RouteData, SSRElement } from '../../@types/astro'; import type { LogOptions } from '../logger.js'; import type { AstroRequest } from './request'; @@ -66,7 +66,7 @@ export interface RenderOptions { pathname: string; scripts: Set; resolve: (s: string) => Promise; - renderers: Renderer[]; + renderers: SSRLoadedRenderer[]; route?: RouteData; routeCache: RouteCache; site?: string; diff --git a/packages/astro/src/core/render/dev/css.ts b/packages/astro/src/core/render/dev/css.ts index 9bb84d939..82141c5cb 100644 --- a/packages/astro/src/core/render/dev/css.ts +++ b/packages/astro/src/core/render/dev/css.ts @@ -1,7 +1,7 @@ import type * as vite from 'vite'; import path from 'path'; -import { viteID } from '../../util.js'; +import { unwrapId, viteID } from '../../util.js'; // https://vitejs.dev/guide/features.html#css-pre-processors export const STYLE_EXTENSIONS = new Set(['.css', '.pcss', '.postcss', '.scss', '.sass', '.styl', '.stylus', '.less']); @@ -13,41 +13,50 @@ const cssRe = new RegExp( ); export const isCSSRequest = (request: string): boolean => cssRe.test(request); -/** - * getStylesForURL - * Given a filePath URL, crawl Vite’s module graph to find style files - */ +/** Given a filePath URL, crawl Vite’s module graph to find all style imports. */ export function getStylesForURL(filePath: URL, viteServer: vite.ViteDevServer): Set { - const css = new Set(); + const importedCssUrls = new Set(); - // recursively crawl module graph to get all style files imported by parent id - function crawlCSS(id: string, scanned = new Set()) { - // note: use .getModulesByFile() to get all related nodes of the same URL - // using .getModuleById() could cause missing style imports on initial server load - const relatedMods = viteServer.moduleGraph.getModulesByFile(id) ?? new Set(); + /** recursively crawl the module graph to get all style files imported by parent id */ + function crawlCSS(_id: string, isFile: boolean, scanned = new Set()) { + const id = unwrapId(_id); const importedModules = new Set(); + const moduleEntriesForId = isFile + ? // If isFile = true, then you are at the root of your module import tree. + // The `id` arg is a filepath, so use `getModulesByFile()` to collect all + // nodes for that file. This is needed for advanced imports like Tailwind. + viteServer.moduleGraph.getModulesByFile(id) ?? new Set() + : // Otherwise, you are following an import in the module import tree. + // You are safe to use getModuleById() here because Vite has already + // resolved the correct `id` for you, by creating the import you followed here. + new Set([viteServer.moduleGraph.getModuleById(id)!]); - for (const relatedMod of relatedMods) { - if (id === relatedMod.id) { + // Collect all imported modules for the module(s). + for (const entry of moduleEntriesForId) { + if (id === entry.id) { scanned.add(id); - for (const importedMod of relatedMod.importedModules) { - importedModules.add(importedMod); + for (const importedModule of entry.importedModules) { + importedModules.add(importedModule); } } } - // scan importedModules + // scan imported modules for CSS imports & add them to our collection. + // Then, crawl that file to follow and scan all deep imports as well. for (const importedModule of importedModules) { - if (!importedModule.id || scanned.has(importedModule.id)) continue; - const ext = path.extname(importedModule.url.toLowerCase()); - if (STYLE_EXTENSIONS.has(ext)) { - css.add(importedModule.url); // note: return `url`s for HTML (not .id, which will break Windows) + if (!importedModule.id || scanned.has(importedModule.id)) { + continue; } - crawlCSS(importedModule.id, scanned); + const ext = path.extname(importedModule.url).toLowerCase(); + if (STYLE_EXTENSIONS.has(ext)) { + // NOTE: We use the `url` property here. `id` would break Windows. + importedCssUrls.add(importedModule.url); + } + crawlCSS(importedModule.id, false, scanned); } } - crawlCSS(viteID(filePath)); - - return css; + // Crawl your import graph for CSS files, populating `importedCssUrls` as a result. + crawlCSS(viteID(filePath), true); + return importedCssUrls; } diff --git a/packages/astro/src/core/render/dev/index.ts b/packages/astro/src/core/render/dev/index.ts index 288ab97a0..09abb7d7b 100644 --- a/packages/astro/src/core/render/dev/index.ts +++ b/packages/astro/src/core/render/dev/index.ts @@ -1,19 +1,15 @@ -import type * as vite from 'vite'; -import type { AstroConfig, ComponentInstance, Renderer, RouteData, RuntimeMode, SSRElement } from '../../../@types/astro'; -import type { AstroRequest } from '../request'; - -import { LogOptions } from '../../logger.js'; import { fileURLToPath } from 'url'; -import { getStylesForURL } from './css.js'; -import { injectTags } from './html.js'; +import type * as vite from 'vite'; +import type { AstroConfig, AstroRenderer, ComponentInstance, RouteData, RuntimeMode, SSRElement, SSRLoadedRenderer } from '../../../@types/astro'; +import { LogOptions } from '../../logger.js'; +import { render as coreRender } from '../core.js'; +import { prependForwardSlash } from '../../../core/path.js'; import { RouteCache } from '../route-cache.js'; -import { resolveRenderers } from './renderers.js'; +import { createModuleScriptElementWithSrcSet } from '../ssr-element.js'; +import { getStylesForURL } from './css.js'; import { errorHandler } from './error.js'; import { getHmrScript } from './hmr.js'; -import { prependForwardSlash } from '../../path.js'; -import { render as coreRender } from '../core.js'; -import { createModuleScriptElementWithSrcSet } from '../ssr-element.js'; - +import { injectTags } from './html.js'; export interface SSROptions { /** an instance of the AstroConfig */ astroConfig: AstroConfig; @@ -39,15 +35,25 @@ export interface SSROptions { headers: Headers; } -export type ComponentPreload = [Renderer[], ComponentInstance]; +export type ComponentPreload = [SSRLoadedRenderer[], ComponentInstance]; export type RenderResponse = { type: 'html'; html: string } | { type: 'response'; response: Response }; const svelteStylesRE = /svelte\?svelte&type=style/; +async function loadRenderer(viteServer: vite.ViteDevServer, renderer: AstroRenderer): Promise { + const { url } = await viteServer.moduleGraph.ensureEntryFromUrl(renderer.serverEntrypoint); + const mod = (await viteServer.ssrLoadModule(url)) as { default: SSRLoadedRenderer['ssr'] }; + return { ...renderer, ssr: mod.default }; +} + +export async function loadRenderers(viteServer: vite.ViteDevServer, astroConfig: AstroConfig): Promise { + return Promise.all(astroConfig._ctx.renderers.map((r) => loadRenderer(viteServer, r))); +} + export async function preload({ astroConfig, filePath, viteServer }: Pick): Promise { // Important: This needs to happen first, in case a renderer provides polyfills. - const renderers = await resolveRenderers(viteServer, astroConfig); + const renderers = await loadRenderers(viteServer, astroConfig); // Load the module from the Vite SSR Runtime. const mod = (await viteServer.ssrLoadModule(fileURLToPath(filePath))) as ComponentInstance; @@ -55,7 +61,7 @@ export async function preload({ astroConfig, filePath, viteServer }: Pick { +export async function render(renderers: SSRLoadedRenderer[], mod: ComponentInstance, ssrOpts: SSROptions): Promise { const { astroConfig, filePath, logging, mode, origin, pathname, method, headers, route, routeCache, viteServer } = ssrOpts; const legacy = astroConfig.buildOptions.legacyBuild; @@ -69,10 +75,19 @@ export async function render(renderers: Renderer[], mod: ComponentInstance, ssrO children: '', }); scripts.add({ - props: { type: 'module', src: new URL('../../../runtime/client/hmr.js', import.meta.url).pathname }, + props: { type: 'module', src: '/@id/astro/client/hmr.js' }, children: '', }); } + // TODO: We should allow adding generic HTML elements to the head, not just scripts + for (const script of astroConfig._ctx.scripts) { + if (script.stage === 'head-inline') { + scripts.add({ + props: {}, + children: script.content, + }); + } + } // Pass framework CSS in as link tags to be appended to the page. let links = new Set(); @@ -105,13 +120,22 @@ export async function render(renderers: Renderer[], mod: ComponentInstance, ssrO origin, pathname, scripts, - // Resolves specifiers in the inline hydrated scripts, such as "@astrojs/renderer-preact/client.js" + // Resolves specifiers in the inline hydrated scripts, such as "@astrojs/preact/client.js" + // TODO: Can we pass the hydration code more directly through Vite, so that we + // don't need to copy-paste and maintain Vite's import resolution here? async resolve(s: string) { // The legacy build needs these to remain unresolved so that vite HTML // Can do the resolution. Without this condition the build output will be // broken in the legacy build. This can be removed once the legacy build is removed. if (!astroConfig.buildOptions.legacyBuild) { - const [, resolvedPath] = await viteServer.moduleGraph.resolveUrl(s); + const [resolvedUrl, resolvedPath] = await viteServer.moduleGraph.resolveUrl(s); + if (resolvedPath.includes('node_modules/.vite')) { + return resolvedPath.replace(/.*?node_modules\/\.vite/, '/node_modules/.vite'); + } + // NOTE: This matches the same logic that Vite uses to add the `/@id/` prefix. + if (!resolvedUrl.startsWith('.') && !resolvedUrl.startsWith('/')) { + return '/@id' + prependForwardSlash(resolvedUrl); + } return '/@fs' + prependForwardSlash(resolvedPath); } else { return s; diff --git a/packages/astro/src/core/render/dev/renderers.ts b/packages/astro/src/core/render/dev/renderers.ts deleted file mode 100644 index f76294ba6..000000000 --- a/packages/astro/src/core/render/dev/renderers.ts +++ /dev/null @@ -1,36 +0,0 @@ -import type * as vite from 'vite'; -import type { AstroConfig, Renderer } from '../../../@types/astro'; - -import { resolveDependency } from '../../util.js'; -import { createRenderer } from '../renderer.js'; - -const cache = new Map>(); - -async function resolveRenderer(viteServer: vite.ViteDevServer, renderer: string, astroConfig: AstroConfig): Promise { - const resolvedRenderer: Renderer = await createRenderer(renderer, { - renderer(name) { - return import(resolveDependency(name, astroConfig)); - }, - async server(entry) { - const { url } = await viteServer.moduleGraph.ensureEntryFromUrl(entry); - const mod = await viteServer.ssrLoadModule(url); - return mod; - }, - }); - - return resolvedRenderer; -} - -export async function resolveRenderers(viteServer: vite.ViteDevServer, astroConfig: AstroConfig): Promise { - const ids: string[] = astroConfig.renderers; - const renderers = await Promise.all( - ids.map((renderer) => { - if (cache.has(renderer)) return cache.get(renderer)!; - let promise = resolveRenderer(viteServer, renderer, astroConfig); - cache.set(renderer, promise); - return promise; - }) - ); - - return renderers; -} diff --git a/packages/astro/src/core/render/renderer.ts b/packages/astro/src/core/render/renderer.ts deleted file mode 100644 index 0a54b6bf0..000000000 --- a/packages/astro/src/core/render/renderer.ts +++ /dev/null @@ -1,30 +0,0 @@ -import type { Renderer } from '../../@types/astro'; - -import npath from 'path'; - -interface RendererResolverImplementation { - renderer: (name: string) => Promise; - server: (entry: string) => Promise; -} - -export async function createRenderer(renderer: string, impl: RendererResolverImplementation) { - const resolvedRenderer: any = {}; - // We can dynamically import the renderer by itself because it shouldn't have - // any non-standard imports, the index is just meta info. - // The other entrypoints need to be loaded through Vite. - const { - default: { name, client, polyfills, hydrationPolyfills, server }, - } = await impl.renderer(renderer); //await import(resolveDependency(renderer, astroConfig)); - - resolvedRenderer.name = name; - if (client) resolvedRenderer.source = npath.posix.join(renderer, client); - resolvedRenderer.serverEntry = npath.posix.join(renderer, server); - if (Array.isArray(hydrationPolyfills)) resolvedRenderer.hydrationPolyfills = hydrationPolyfills.map((src: string) => npath.posix.join(renderer, src)); - if (Array.isArray(polyfills)) resolvedRenderer.polyfills = polyfills.map((src: string) => npath.posix.join(renderer, src)); - - const { default: rendererSSR } = await impl.server(resolvedRenderer.serverEntry); - resolvedRenderer.ssr = rendererSSR; - - const completedRenderer: Renderer = resolvedRenderer; - return completedRenderer; -} diff --git a/packages/astro/src/core/render/result.ts b/packages/astro/src/core/render/result.ts index f43382bb3..9edef6bad 100644 --- a/packages/astro/src/core/render/result.ts +++ b/packages/astro/src/core/render/result.ts @@ -1,12 +1,10 @@ -import type { AstroGlobal, AstroGlobalPartial, MarkdownParser, MarkdownRenderOptions, Params, Renderer, SSRElement, SSRResult } from '../../@types/astro'; -import type { AstroRequest } from './request'; - import { bold } from 'kleur/colors'; -import { createRequest } from './request.js'; -import { isCSSRequest } from './dev/css.js'; -import { isScriptRequest } from './script.js'; +import type { AstroGlobal, AstroGlobalPartial, MarkdownParser, MarkdownRenderOptions, Params, SSRElement, SSRLoadedRenderer, SSRResult } from '../../@types/astro'; import { renderSlot } from '../../runtime/server/index.js'; -import { warn, LogOptions } from '../logger.js'; +import { LogOptions, warn } from '../logger.js'; +import { isCSSRequest } from './dev/css.js'; +import { createRequest } from './request.js'; +import { isScriptRequest } from './script.js'; function onlyAvailableInSSR(name: string) { return function () { @@ -23,7 +21,7 @@ export interface CreateResultArgs { markdownRender: MarkdownRenderOptions; params: Params; pathname: string; - renderers: Renderer[]; + renderers: SSRLoadedRenderer[]; resolve: (s: string) => Promise; site: string | undefined; links?: Set; diff --git a/packages/astro/src/core/util.ts b/packages/astro/src/core/util.ts index f4319b7cf..17f06854d 100644 --- a/packages/astro/src/core/util.ts +++ b/packages/astro/src/core/util.ts @@ -25,6 +25,16 @@ export function isValidURL(url: string): boolean { return false; } +/** Returns true if argument is an object of any prototype/class (but not null). */ +export function isObject(value: unknown): value is Record { + return typeof value === 'object' && value != null; +} + +/** Wraps an object in an array. If an array is passed, ignore it. */ +export function arraify(target: T | T[]): T[] { + return Array.isArray(target) ? target : [target]; +} + /** is a specifier an npm package? */ export function parseNpmName(spec: string): { scope?: string; name: string; subpath?: string } | undefined { // not an npm package @@ -98,6 +108,14 @@ export function viteID(filePath: URL): string { return slash(fileURLToPath(filePath)); } +export const VALID_ID_PREFIX = `/@id/`; + +// Strip valid id prefix. This is prepended to resolved Ids that are +// not valid browser import specifiers by the importAnalysis plugin. +export function unwrapId(id: string): string { + return id.startsWith(VALID_ID_PREFIX) ? id.slice(VALID_ID_PREFIX.length) : id; +} + /** An fs utility, similar to `rimraf` or `rm -rf` */ export function removeDir(_dir: URL): void { const dir = fileURLToPath(_dir); diff --git a/packages/astro/src/integrations/index.ts b/packages/astro/src/integrations/index.ts new file mode 100644 index 000000000..af6736780 --- /dev/null +++ b/packages/astro/src/integrations/index.ts @@ -0,0 +1,76 @@ +import type { AddressInfo } from 'net'; +import type { ViteDevServer } from 'vite'; +import { AstroConfig, AstroRenderer } from '../@types/astro.js'; +import { mergeConfig } from '../core/config.js'; + +export async function runHookConfigSetup({ config: _config, command }: { config: AstroConfig; command: 'dev' | 'build' }): Promise { + let updatedConfig: AstroConfig = { ..._config }; + for (const integration of _config.integrations) { + if (integration.hooks['astro:config:setup']) { + await integration.hooks['astro:config:setup']({ + config: updatedConfig, + command, + addRenderer(renderer: AstroRenderer) { + updatedConfig._ctx.renderers.push(renderer); + }, + injectScript: (stage, content) => { + updatedConfig._ctx.scripts.push({ stage, content }); + }, + updateConfig: (newConfig) => { + updatedConfig = mergeConfig(updatedConfig, newConfig) as AstroConfig; + }, + }); + } + } + return updatedConfig; +} + +export async function runHookConfigDone({ config }: { config: AstroConfig }) { + for (const integration of config.integrations) { + if (integration.hooks['astro:config:done']) { + await integration.hooks['astro:config:done']({ + config, + }); + } + } +} + +export async function runHookServerSetup({ config, server }: { config: AstroConfig; server: ViteDevServer }) { + for (const integration of config.integrations) { + if (integration.hooks['astro:server:setup']) { + await integration.hooks['astro:server:setup']({ server }); + } + } +} + +export async function runHookServerStart({ config, address }: { config: AstroConfig; address: AddressInfo }) { + for (const integration of config.integrations) { + if (integration.hooks['astro:server:start']) { + await integration.hooks['astro:server:start']({ address }); + } + } +} + +export async function runHookServerDone({ config }: { config: AstroConfig }) { + for (const integration of config.integrations) { + if (integration.hooks['astro:server:done']) { + await integration.hooks['astro:server:done'](); + } + } +} + +export async function runHookBuildStart({ config }: { config: AstroConfig }) { + for (const integration of config.integrations) { + if (integration.hooks['astro:build:start']) { + await integration.hooks['astro:build:start'](); + } + } +} + +export async function runHookBuildDone({ config, pages }: { config: AstroConfig; pages: string[] }) { + for (const integration of config.integrations) { + if (integration.hooks['astro:build:done']) { + await integration.hooks['astro:build:done']({ pages: pages.map((p) => ({ pathname: p })), dir: config.dist }); + } + } +} diff --git a/packages/astro/src/runtime/server/hydration.ts b/packages/astro/src/runtime/server/hydration.ts index 2ffdc9144..5f106d942 100644 --- a/packages/astro/src/runtime/server/hydration.ts +++ b/packages/astro/src/runtime/server/hydration.ts @@ -1,4 +1,4 @@ -import type { AstroComponentMetadata } from '../../@types/astro'; +import type { AstroComponentMetadata, SSRLoadedRenderer } from '../../@types/astro'; import type { SSRElement, SSRResult } from '../../@types/astro'; import { hydrationSpecifier, serializeListValue } from './util.js'; import serializeJavaScript from 'serialize-javascript'; @@ -81,7 +81,7 @@ export function extractDirectives(inputProps: Record): Ext } interface HydrateScriptOptions { - renderer: any; + renderer: SSRLoadedRenderer; result: SSRResult; astroId: string; props: Record; @@ -96,16 +96,11 @@ export async function generateHydrateScript(scriptOptions: HydrateScriptOptions, throw new Error(`Unable to resolve a componentExport for "${metadata.displayName}"! Please open an issue.`); } - let hydrationSource = ''; - if (renderer.hydrationPolyfills) { - hydrationSource += `await Promise.all([${(await Promise.all(renderer.hydrationPolyfills.map(async (src: string) => `\n import("${await result.resolve(src)}")`))).join( - ', ' - )}]);\n`; - } + let hydrationSource = ``; - hydrationSource += renderer.source + hydrationSource += renderer.clientEntrypoint ? `const [{ ${componentExport.value}: Component }, { default: hydrate }] = await Promise.all([import("${await result.resolve(componentUrl)}"), import("${await result.resolve( - renderer.source + renderer.clientEntrypoint )}")]); return (el, children) => hydrate(el)(Component, ${serializeProps(props)}, children); ` @@ -116,6 +111,7 @@ export async function generateHydrateScript(scriptOptions: HydrateScriptOptions, const hydrationScript = { props: { type: 'module', 'data-astro-component-hydration': true }, children: `import setup from '${await result.resolve(hydrationSpecifier(hydrate))}'; +${`import '${await result.resolve('astro:scripts/before-hydration.js')}';`} setup("${astroId}", {name:"${metadata.displayName}",${metadata.hydrateArgs ? `value: ${JSON.stringify(metadata.hydrateArgs)}` : ''}}, async () => { ${hydrationSource} }); diff --git a/packages/astro/src/runtime/server/index.ts b/packages/astro/src/runtime/server/index.ts index da510f2fb..d977219ac 100644 --- a/packages/astro/src/runtime/server/index.ts +++ b/packages/astro/src/runtime/server/index.ts @@ -1,19 +1,14 @@ -import type { AstroComponentMetadata, EndpointHandler, Renderer, Params } from '../../@types/astro'; -import type { AstroGlobalPartial, SSRResult, SSRElement } from '../../@types/astro'; -import type { AstroRequest } from '../../core/render/request'; - import shorthash from 'shorthash'; +import type { AstroComponentMetadata, AstroGlobalPartial, EndpointHandler, Params, SSRElement, SSRLoadedRenderer, SSRResult } from '../../@types/astro'; +import type { AstroRequest } from '../../core/render/request'; +import { escapeHTML, HTMLString, markHTMLString } from './escape.js'; import { extractDirectives, generateHydrateScript, serializeProps } from './hydration.js'; import { serializeListValue } from './util.js'; -import { escapeHTML, HTMLString, markHTMLString } from './escape.js'; +export { markHTMLString, markHTMLString as unescapeHTML } from './escape.js'; export type { Metadata } from './metadata'; export { createMetadata } from './metadata.js'; -export { markHTMLString } from './escape.js'; -// TODO(deprecated): This name has been updated in Astro runtime but not yet in the Astro compiler. -export { markHTMLString as unescapeHTML } from './escape.js'; - const voidElementNames = /^(area|base|br|col|command|embed|hr|img|input|keygen|link|meta|param|source|track|wbr)$/i; const htmlBooleanAttributes = /^(allowfullscreen|async|autofocus|autoplay|controls|default|defer|disabled|disablepictureinpicture|disableremoteplayback|formnovalidate|hidden|loop|nomodule|novalidate|open|playsinline|readonly|required|reversed|scoped|seamless|itemscope)$/i; @@ -116,14 +111,14 @@ function guessRenderers(componentUrl?: string): string[] { const extname = componentUrl?.split('.').pop(); switch (extname) { case 'svelte': - return ['@astrojs/renderer-svelte']; + return ['@astrojs/svelte']; case 'vue': - return ['@astrojs/renderer-vue']; + return ['@astrojs/vue']; case 'jsx': case 'tsx': - return ['@astrojs/renderer-react', '@astrojs/renderer-preact']; + return ['@astrojs/react', '@astrojs/preact']; default: - return ['@astrojs/renderer-react', '@astrojs/renderer-preact', '@astrojs/renderer-vue', '@astrojs/renderer-svelte']; + return ['@astrojs/react', '@astrojs/preact', '@astrojs/vue', '@astrojs/svelte']; } } @@ -171,13 +166,13 @@ export async function renderComponent(result: SSRResult, displayName: string, Co if (Array.isArray(renderers) && renderers.length === 0 && typeof Component !== 'string' && !componentIsHTMLElement(Component)) { const message = `Unable to render ${metadata.displayName}! -There are no \`renderers\` set in your \`astro.config.mjs\` file. -Did you mean to enable ${formatList(probableRendererNames.map((r) => '`' + r + '`'))}?`; +There are no \`integrations\` set in your \`astro.config.mjs\` file. +Did you mean to add ${formatList(probableRendererNames.map((r) => '`' + r + '`'))}?`; throw new Error(message); } // Call the renderers `check` hook to see if any claim this component. - let renderer: Renderer | undefined; + let renderer: SSRLoadedRenderer | undefined; if (metadata.hydrate !== 'only') { for (const r of renderers) { if (await r.ssr.check(Component, props, children)) { @@ -195,7 +190,7 @@ Did you mean to enable ${formatList(probableRendererNames.map((r) => '`' + r + ' // Attempt: use explicitly passed renderer name if (metadata.hydrateArgs) { const rendererName = metadata.hydrateArgs; - renderer = renderers.filter(({ name }) => name === `@astrojs/renderer-${rendererName}` || name === rendererName)[0]; + renderer = renderers.filter(({ name }) => name === `@astrojs/${rendererName}` || name === rendererName)[0]; } // Attempt: user only has a single renderer, default to that if (!renderer && renderers.length === 1) { @@ -204,7 +199,7 @@ Did you mean to enable ${formatList(probableRendererNames.map((r) => '`' + r + ' // Attempt: can we guess the renderer from the export extension? if (!renderer) { const extname = metadata.componentUrl?.split('.').pop(); - renderer = renderers.filter(({ name }) => name === `@astrojs/renderer-${extname}` || name === extname)[0]; + renderer = renderers.filter(({ name }) => name === `@astrojs/${extname}` || name === extname)[0]; } } @@ -215,7 +210,7 @@ Did you mean to enable ${formatList(probableRendererNames.map((r) => '`' + r + ' throw new Error(`Unable to render ${metadata.displayName}! Using the \`client:only\` hydration strategy, Astro needs a hint to use the correct renderer. -Did you mean to pass <${metadata.displayName} client:only="${probableRendererNames.map((r) => r.replace('@astrojs/renderer-', '')).join('|')}" /> +Did you mean to pass <${metadata.displayName} client:only="${probableRendererNames.map((r) => r.replace('@astrojs/', '')).join('|')}" /> `); } else if (typeof Component !== 'string') { const matchingRenderers = renderers.filter((r) => probableRendererNames.includes(r.name)); @@ -264,16 +259,6 @@ If you're still stuck, please open an issue on GitHub or join us at https://astr ); } - // This is used to add polyfill scripts to the page, if the renderer needs them. - if (renderer?.polyfills?.length) { - for (const src of renderer.polyfills) { - result.scripts.add({ - props: { type: 'module' }, - children: `import "${await result.resolve(src)}";`, - }); - } - } - if (!hydration) { return markHTMLString(html.replace(/\<\/?astro-fragment\>/g, '')); } @@ -283,7 +268,7 @@ If you're still stuck, please open an issue on GitHub or join us at https://astr // Rather than appending this inline in the page, puts this into the `result.scripts` set that will be appended to the head. // INVESTIGATE: This will likely be a problem in streaming because the `` will be gone at this point. - result.scripts.add(await generateHydrateScript({ renderer, result, astroId, props }, metadata as Required)); + result.scripts.add(await generateHydrateScript({ renderer: renderer!, result, astroId, props }, metadata as Required)); // Render a template if no fragment is provided. const needsAstroTemplate = children && !/<\/?astro-fragment\>/.test(html); diff --git a/packages/astro/src/vite-plugin-astro/compile.ts b/packages/astro/src/vite-plugin-astro/compile.ts index f9075e3e7..48bada5f4 100644 --- a/packages/astro/src/vite-plugin-astro/compile.ts +++ b/packages/astro/src/vite-plugin-astro/compile.ts @@ -122,13 +122,7 @@ export function invalidateCompilation(config: AstroConfig, filename: string) { } } -export async function cachedCompilation( - config: AstroConfig, - filename: string, - source: string | null, - viteTransform: TransformHook, - opts: { ssr: boolean } -): Promise { +export async function cachedCompilation(config: AstroConfig, filename: string, source: string, viteTransform: TransformHook, opts: { ssr: boolean }): Promise { let cache: CompilationCache; if (!configCache.has(config)) { cache = new Map(); @@ -139,11 +133,6 @@ export async function cachedCompilation( if (cache.has(filename)) { return cache.get(filename)!; } - - if (source === null) { - const fileUrl = new URL(`file://${filename}`); - source = await fs.promises.readFile(fileUrl, 'utf-8'); - } const compileResult = await compile(config, filename, source, viteTransform, opts); cache.set(filename, compileResult); return compileResult; diff --git a/packages/astro/src/vite-plugin-astro/index.ts b/packages/astro/src/vite-plugin-astro/index.ts index e7dce20fd..0f169caa1 100644 --- a/packages/astro/src/vite-plugin-astro/index.ts +++ b/packages/astro/src/vite-plugin-astro/index.ts @@ -35,7 +35,7 @@ export default function astro({ config, logging }: AstroPluginOptions): vite.Plu return slash(fileURLToPath(url)) + url.search; } - let isProduction: boolean; + let resolvedConfig: vite.ResolvedConfig; let viteTransform: TransformHook; let viteDevServer: vite.ViteDevServer | null = null; @@ -46,9 +46,9 @@ export default function astro({ config, logging }: AstroPluginOptions): vite.Plu return { name: 'astro:build', enforce: 'pre', // run transforms before other plugins can - configResolved(resolvedConfig) { + configResolved(_resolvedConfig) { + resolvedConfig = _resolvedConfig; viteTransform = getViteTransform(resolvedConfig); - isProduction = resolvedConfig.isProduction; }, configureServer(server) { viteDevServer = server; @@ -83,20 +83,26 @@ export default function astro({ config, logging }: AstroPluginOptions): vite.Plu } }, async load(id, opts) { - let { filename, query } = parseAstroRequest(id); + const parsedId = parseAstroRequest(id); + const query = parsedId.query; + if (!id.endsWith('.astro') && !query.astro) { + return null; + } + + const filename = normalizeFilename(parsedId.filename); + const fileUrl = new URL(`file://${filename}`); + let source = await fs.promises.readFile(fileUrl, 'utf-8'); + const isPage = filename.startsWith(config.pages.pathname); + if (isPage && config._ctx.scripts.some((s) => s.stage === 'page')) { + source += `\n` }; +} + +export default { + check, + renderToStaticMarkup, +}; diff --git a/packages/integrations/solid/src/index.ts b/packages/integrations/solid/src/index.ts new file mode 100644 index 000000000..1205c6d09 --- /dev/null +++ b/packages/integrations/solid/src/index.ts @@ -0,0 +1,57 @@ +import type { AstroIntegration, AstroRenderer } from 'astro'; + +function getRenderer(): AstroRenderer { + return { + name: '@astrojs/solid-js', + clientEntrypoint: '@astrojs/solid-js/client.js', + serverEntrypoint: '@astrojs/solid-js/server.js', + jsxImportSource: 'solid-js', + jsxTransformOptions: async ({ ssr }) => { + // @ts-expect-error types not found + const [{ default: solid }] = await Promise.all([import('babel-preset-solid')]); + const options = { + presets: [solid({}, { generate: ssr ? 'ssr' : 'dom', hydratable: true })], + plugins: [], + }; + + return options; + }, + }; +} + +function getViteConfiguration(isDev: boolean) { + // https://github.com/solidjs/vite-plugin-solid + // We inject the dev mode only if the user explicitely wants it or if we are in dev (serve) mode + const nestedDeps = ['solid-js', 'solid-js/web', 'solid-js/store', 'solid-js/html', 'solid-js/h']; + return { + /** + * We only need esbuild on .ts or .js files. + * .tsx & .jsx files are handled by us + */ + esbuild: { include: /\.ts$/ }, + resolve: { + conditions: ['solid', ...(isDev ? ['development'] : [])], + dedupe: nestedDeps, + alias: [{ find: /^solid-refresh$/, replacement: '/@solid-refresh' }], + }, + optimizeDeps: { + include: nestedDeps, + exclude: ['@astrojs/solid-js/server.js'], + }, + ssr: { + external: ['babel-preset-solid'], + }, + }; +} + +export default function (): AstroIntegration { + return { + name: '@astrojs/solid-js', + hooks: { + 'astro:config:setup': ({ command, addRenderer, updateConfig }) => { + addRenderer(getRenderer()); + updateConfig({ vite: getViteConfiguration(command === 'dev') }); + }, + }, + }; +} diff --git a/packages/integrations/solid/static-html.js b/packages/integrations/solid/static-html.js new file mode 100644 index 000000000..9f969eac9 --- /dev/null +++ b/packages/integrations/solid/static-html.js @@ -0,0 +1,12 @@ +import { ssr } from 'solid-js/web'; + +/** + * Astro passes `children` as a string of HTML, so we need + * a wrapper `astro-fragment` to render that content as VNodes. + */ +const StaticHtml = ({ innerHTML }) => { + if (!innerHTML) return null; + return ssr(`${innerHTML}`); +}; + +export default StaticHtml; diff --git a/packages/integrations/solid/tsconfig.json b/packages/integrations/solid/tsconfig.json new file mode 100644 index 000000000..44baf375c --- /dev/null +++ b/packages/integrations/solid/tsconfig.json @@ -0,0 +1,10 @@ +{ + "extends": "../../../tsconfig.base.json", + "include": ["src"], + "compilerOptions": { + "allowJs": true, + "module": "ES2020", + "outDir": "./dist", + "target": "ES2020" + } +} diff --git a/packages/integrations/svelte/Wrapper.svelte b/packages/integrations/svelte/Wrapper.svelte new file mode 100644 index 000000000..c1ee77d91 --- /dev/null +++ b/packages/integrations/svelte/Wrapper.svelte @@ -0,0 +1,21 @@ + + + + {#if __astro_children != null} + + {@html __astro_children} + + {/if} + diff --git a/packages/integrations/svelte/Wrapper.svelte.ssr.js b/packages/integrations/svelte/Wrapper.svelte.ssr.js new file mode 100644 index 000000000..9bca437b5 --- /dev/null +++ b/packages/integrations/svelte/Wrapper.svelte.ssr.js @@ -0,0 +1,14 @@ +/* App.svelte generated by Svelte v3.38.2 */ +import { create_ssr_component, missing_component, validate_component } from 'svelte/internal'; + +const App = create_ssr_component(($$result, $$props, $$bindings, slots) => { + const { __astro_component: Component, __astro_children, ...props } = $$props; + const children = {}; + if (__astro_children != null) { + children.default = () => `${__astro_children}`; + } + + return `${validate_component(Component || missing_component, 'svelte:component').$$render($$result, Object.assign(props), {}, children)}`; +}); + +export default App; diff --git a/packages/integrations/svelte/client.js b/packages/integrations/svelte/client.js new file mode 100644 index 000000000..c10c7afa0 --- /dev/null +++ b/packages/integrations/svelte/client.js @@ -0,0 +1,14 @@ +import SvelteWrapper from './Wrapper.svelte'; + +export default (target) => { + return (component, props, children) => { + delete props['class']; + try { + new SvelteWrapper({ + target, + props: { __astro_component: component, __astro_children: children, ...props }, + hydrate: true, + }); + } catch (e) {} + }; +}; diff --git a/packages/integrations/svelte/package.json b/packages/integrations/svelte/package.json new file mode 100644 index 000000000..a6fec87a4 --- /dev/null +++ b/packages/integrations/svelte/package.json @@ -0,0 +1,43 @@ +{ + "name": "@astrojs/svelte", + "version": "0.0.1", + "description": "Use Svelte components within Astro", + "type": "module", + "types": "./dist/index.d.ts", + "author": "withastro", + "license": "MIT", + "repository": { + "type": "git", + "url": "https://github.com/withastro/astro.git", + "directory": "packages/integrations/svelte" + }, + "bugs": "https://github.com/withastro/astro/issues", + "homepage": "https://astro.build", + "exports": { + ".": "./dist/index.js", + "./*": "./*", + "./client.js": "./client.js", + "./server.js": "./server.js", + "./package.json": "./package.json" + }, + "scripts": { + "build": "astro-scripts build \"src/**/*.ts\" && tsc", + "dev": "astro-scripts dev \"src/**/*.ts\"" + }, + "dependencies": { + "@sveltejs/vite-plugin-svelte": "^1.0.0-next.37", + "postcss-load-config": "^3.1.1", + "svelte-preprocess": "^4.10.2" + }, + "devDependencies": { + "astro": "workspace:*", + "astro-scripts": "workspace:*", + "svelte": "^3.46.4" + }, + "peerDependencies": { + "svelte": "^3.46.4" + }, + "engines": { + "node": "^14.15.0 || >=16.0.0" + } +} diff --git a/packages/integrations/svelte/server.js b/packages/integrations/svelte/server.js new file mode 100644 index 000000000..c51b2f4b4 --- /dev/null +++ b/packages/integrations/svelte/server.js @@ -0,0 +1,15 @@ +import SvelteWrapper from './Wrapper.svelte.ssr.js'; + +function check(Component) { + return Component['render'] && Component['$$render']; +} + +async function renderToStaticMarkup(Component, props, children) { + const { html } = SvelteWrapper.render({ __astro_component: Component, __astro_children: children, ...props }); + return { html }; +} + +export default { + check, + renderToStaticMarkup, +}; diff --git a/packages/integrations/svelte/src/index.ts b/packages/integrations/svelte/src/index.ts new file mode 100644 index 000000000..f5a3dd945 --- /dev/null +++ b/packages/integrations/svelte/src/index.ts @@ -0,0 +1,48 @@ +import type { AstroIntegration, AstroRenderer } from 'astro'; +import { svelte } from '@sveltejs/vite-plugin-svelte'; +import preprocess from 'svelte-preprocess'; + +function getRenderer(): AstroRenderer { + return { + name: '@astrojs/svelte', + clientEntrypoint: '@astrojs/svelte/client.js', + serverEntrypoint: '@astrojs/svelte/server.js', + }; +} + +function getViteConfiguration(isDev: boolean) { + return { + optimizeDeps: { + include: ['@astrojs/svelte/client.js', 'svelte', 'svelte/internal'], + exclude: ['@astrojs/svelte/server.js'], + }, + plugins: [ + svelte({ + emitCss: true, + compilerOptions: { dev: isDev, hydratable: true }, + preprocess: [ + preprocess({ + less: true, + sass: { renderSync: true }, + scss: { renderSync: true }, + stylus: true, + typescript: true, + }), + ], + }), + ], + }; +} + +export default function (): AstroIntegration { + return { + name: '@astrojs/svelte', + hooks: { + // Anything that gets returned here is merged into Astro Config + 'astro:config:setup': ({ command, updateConfig, addRenderer }) => { + addRenderer(getRenderer()); + updateConfig({ vite: getViteConfiguration(command === 'dev') }); + }, + }, + }; +} diff --git a/packages/integrations/svelte/tsconfig.json b/packages/integrations/svelte/tsconfig.json new file mode 100644 index 000000000..44baf375c --- /dev/null +++ b/packages/integrations/svelte/tsconfig.json @@ -0,0 +1,10 @@ +{ + "extends": "../../../tsconfig.base.json", + "include": ["src"], + "compilerOptions": { + "allowJs": true, + "module": "ES2020", + "outDir": "./dist", + "target": "ES2020" + } +} diff --git a/examples/with-tailwindcss/src/styles/global.css b/packages/integrations/tailwind/base.css similarity index 100% rename from examples/with-tailwindcss/src/styles/global.css rename to packages/integrations/tailwind/base.css diff --git a/packages/integrations/tailwind/package.json b/packages/integrations/tailwind/package.json new file mode 100644 index 000000000..99116f5c6 --- /dev/null +++ b/packages/integrations/tailwind/package.json @@ -0,0 +1,42 @@ +{ + "name": "@astrojs/tailwind", + "description": "Tailwind + Astro Integrations", + "version": "0.0.1", + "type": "module", + "types": "./dist/index.d.ts", + "author": "withastro", + "license": "MIT", + "repository": { + "type": "git", + "url": "https://github.com/withastro/astro.git", + "directory": "packages/integrations/tailwind" + }, + "bugs": "https://github.com/withastro/astro/issues", + "homepage": "https://astro.build", + "exports": { + ".": "./dist/index.js", + "./base.css": "./base.css", + "./package.json": "./package.json" + }, + "scripts": { + "build": "astro-scripts build \"src/**/*.ts\" && tsc", + "dev": "astro-scripts dev \"src/**/*.ts\"" + }, + "dependencies": { + "tailwindcss": "^3.0.23", + "autoprefixer": "^10.4.4", + "postcss": "^8.4.12" + }, + "devDependencies": { + "@types/tailwindcss": "^3.0.9", + "astro": "workspace:*", + "astro-scripts": "workspace:*" + }, + "pnpm": { + "peerDependencyRules": { + "ignoreMissing": [ + "postcss" + ] + } + } +} diff --git a/packages/integrations/tailwind/src/index.ts b/packages/integrations/tailwind/src/index.ts new file mode 100644 index 000000000..30905f9d1 --- /dev/null +++ b/packages/integrations/tailwind/src/index.ts @@ -0,0 +1,31 @@ +import type { AstroIntegration } from 'astro'; +import { fileURLToPath } from 'url'; +import path from 'path'; +import tailwindPlugin from 'tailwindcss'; +import autoprefixerPlugin from 'autoprefixer'; + +function getDefaultTailwindConfig(srcUrl: URL) { + return { + theme: { + extend: {}, + }, + plugins: [], + content: [path.join(fileURLToPath(srcUrl), `**`, `*.{astro,html,js,jsx,svelte,ts,tsx,vue}`)], + }; +} + +export default function (): AstroIntegration { + return { + name: '@astrojs/tailwind', + hooks: { + 'astro:config:setup': ({ config, injectScript }) => { + // Inject the Tailwind postcss plugin + config.styleOptions.postcss.plugins.push(tailwindPlugin(getDefaultTailwindConfig(config.src))); + config.styleOptions.postcss.plugins.push(autoprefixerPlugin); + + // Inject the Tailwind base import + injectScript('page-ssr', `import '@astrojs/tailwind/base.css';`); + }, + }, + }; +} diff --git a/packages/integrations/tailwind/tsconfig.json b/packages/integrations/tailwind/tsconfig.json new file mode 100644 index 000000000..44baf375c --- /dev/null +++ b/packages/integrations/tailwind/tsconfig.json @@ -0,0 +1,10 @@ +{ + "extends": "../../../tsconfig.base.json", + "include": ["src"], + "compilerOptions": { + "allowJs": true, + "module": "ES2020", + "outDir": "./dist", + "target": "ES2020" + } +} diff --git a/packages/integrations/turbolinks/client.js b/packages/integrations/turbolinks/client.js new file mode 100644 index 000000000..6dde8c193 --- /dev/null +++ b/packages/integrations/turbolinks/client.js @@ -0,0 +1,2 @@ +import Turbolinks from 'turbolinks'; +export { Turbolinks }; diff --git a/packages/integrations/turbolinks/package.json b/packages/integrations/turbolinks/package.json new file mode 100644 index 000000000..99834fe77 --- /dev/null +++ b/packages/integrations/turbolinks/package.json @@ -0,0 +1,32 @@ +{ + "name": "@astrojs/turbolinks", + "description": "Turbolinks + Astro Integrations", + "version": "0.0.1", + "type": "module", + "types": "./dist/index.d.ts", + "author": "withastro", + "license": "MIT", + "repository": { + "type": "git", + "url": "https://github.com/withastro/astro.git", + "directory": "packages/integrations/turbolinks" + }, + "bugs": "https://github.com/withastro/astro/issues", + "homepage": "https://astro.build", + "exports": { + ".": "./dist/index.js", + "./client.js": "./client.js", + "./package.json": "./package.json" + }, + "scripts": { + "build": "astro-scripts build \"src/**/*.ts\" && tsc", + "dev": "astro-scripts dev \"src/**/*.ts\"" + }, + "dependencies": { + "turbolinks": "^5.2.0" + }, + "devDependencies": { + "astro": "workspace:*", + "astro-scripts": "workspace:*" + } +} diff --git a/packages/integrations/turbolinks/src/index.ts b/packages/integrations/turbolinks/src/index.ts new file mode 100644 index 000000000..3299736ba --- /dev/null +++ b/packages/integrations/turbolinks/src/index.ts @@ -0,0 +1,15 @@ +import type { AstroIntegration } from 'astro'; + +export default function createPlugin(): AstroIntegration { + return { + name: '@astrojs/turbolinks', + hooks: { + 'astro:config:setup': ({ injectScript }) => { + // This gets injected into the user's page, so we need to re-export Turbolinks + // from our own package so that package managers like pnpm don't get mad and + // can follow the import correctly. + injectScript('page', `import {Turbolinks} from "@astrojs/turbolinks/client.js"; Turbolinks.start();`); + }, + }, + }; +} diff --git a/packages/integrations/turbolinks/tsconfig.json b/packages/integrations/turbolinks/tsconfig.json new file mode 100644 index 000000000..44baf375c --- /dev/null +++ b/packages/integrations/turbolinks/tsconfig.json @@ -0,0 +1,10 @@ +{ + "extends": "../../../tsconfig.base.json", + "include": ["src"], + "compilerOptions": { + "allowJs": true, + "module": "ES2020", + "outDir": "./dist", + "target": "ES2020" + } +} diff --git a/packages/integrations/vue/client.js b/packages/integrations/vue/client.js new file mode 100644 index 000000000..0ba4e8106 --- /dev/null +++ b/packages/integrations/vue/client.js @@ -0,0 +1,14 @@ +import { h, createSSRApp } from 'vue'; +import StaticHtml from './static-html.js'; + +export default (element) => (Component, props, children) => { + delete props['class']; + // Expose name on host component for Vue devtools + const name = Component.name ? `${Component.name} Host` : undefined; + const slots = {}; + if (children != null) { + slots.default = () => h(StaticHtml, { value: children }); + } + const app = createSSRApp({ name, render: () => h(Component, props, slots) }); + app.mount(element, true); +}; diff --git a/packages/integrations/vue/package.json b/packages/integrations/vue/package.json new file mode 100644 index 000000000..8fce8e77a --- /dev/null +++ b/packages/integrations/vue/package.json @@ -0,0 +1,41 @@ +{ + "name": "@astrojs/vue", + "version": "0.0.1", + "description": "Use Vue components within Astro", + "type": "module", + "types": "./dist/index.d.ts", + "author": "withastro", + "license": "MIT", + "repository": { + "type": "git", + "url": "https://github.com/withastro/astro.git", + "directory": "packages/integrations/vue" + }, + "bugs": "https://github.com/withastro/astro/issues", + "homepage": "https://astro.build", + "exports": { + ".": "./dist/index.js", + "./*": "./*", + "./client.js": "./client.js", + "./server.js": "./server.js", + "./package.json": "./package.json" + }, + "scripts": { + "build": "astro-scripts build \"src/**/*.ts\" && tsc", + "dev": "astro-scripts dev \"src/**/*.ts\"" + }, + "dependencies": { + "@vitejs/plugin-vue": "^2.2.0" + }, + "devDependencies": { + "astro": "workspace:*", + "astro-scripts": "workspace:*", + "vue": "^3.2.30" + }, + "peerDependencies": { + "vue": "^3.2.30" + }, + "engines": { + "node": "^14.15.0 || >=16.0.0" + } +} diff --git a/packages/integrations/vue/server.js b/packages/integrations/vue/server.js new file mode 100644 index 000000000..1ae2b757b --- /dev/null +++ b/packages/integrations/vue/server.js @@ -0,0 +1,22 @@ +import { h, createSSRApp } from 'vue'; +import { renderToString } from 'vue/server-renderer'; +import StaticHtml from './static-html.js'; + +function check(Component) { + return !!Component['ssrRender']; +} + +async function renderToStaticMarkup(Component, props, children) { + const slots = {}; + if (children != null) { + slots.default = () => h(StaticHtml, { value: children }); + } + const app = createSSRApp({ render: () => h(Component, props, slots) }); + const html = await renderToString(app); + return { html }; +} + +export default { + check, + renderToStaticMarkup, +}; diff --git a/packages/integrations/vue/src/index.ts b/packages/integrations/vue/src/index.ts new file mode 100644 index 000000000..20adf0f66 --- /dev/null +++ b/packages/integrations/vue/src/index.ts @@ -0,0 +1,35 @@ +import type { AstroIntegration, AstroRenderer } from 'astro'; +import vue from '@vitejs/plugin-vue'; + +function getRenderer(): AstroRenderer { + return { + name: '@astrojs/vue', + clientEntrypoint: '@astrojs/vue/client.js', + serverEntrypoint: '@astrojs/vue/server.js', + }; +} + +function getViteConfiguration() { + return { + optimizeDeps: { + include: ['@astrojs/vue/client.js', 'vue'], + exclude: ['@astrojs/vue/server.js'], + }, + plugins: [vue()], + ssr: { + external: ['@vue/server-renderer'], + }, + }; +} + +export default function (): AstroIntegration { + return { + name: '@astrojs/vue', + hooks: { + 'astro:config:setup': ({ addRenderer, updateConfig }) => { + addRenderer(getRenderer()); + updateConfig({ vite: getViteConfiguration() }); + }, + }, + }; +} diff --git a/packages/integrations/vue/static-html.js b/packages/integrations/vue/static-html.js new file mode 100644 index 000000000..ff1459b6f --- /dev/null +++ b/packages/integrations/vue/static-html.js @@ -0,0 +1,27 @@ +import { h, defineComponent } from 'vue'; + +/** + * Astro passes `children` as a string of HTML, so we need + * a wrapper `div` to render that content as VNodes. + * + * This is the Vue + JSX equivalent of using `
` + */ +const StaticHtml = defineComponent({ + props: { + value: String, + }, + setup({ value }) { + if (!value) return () => null; + return () => h('astro-fragment', { innerHTML: value }); + }, +}); + +/** + * Other frameworks have `shouldComponentUpdate` in order to signal + * that this subtree is entirely static and will not be updated + * + * Fortunately, Vue is smart enough to figure that out without any + * help from us, so this just works out of the box! + */ + +export default StaticHtml; diff --git a/packages/integrations/vue/tsconfig.json b/packages/integrations/vue/tsconfig.json new file mode 100644 index 000000000..44baf375c --- /dev/null +++ b/packages/integrations/vue/tsconfig.json @@ -0,0 +1,10 @@ +{ + "extends": "../../../tsconfig.base.json", + "include": ["src"], + "compilerOptions": { + "allowJs": true, + "module": "ES2020", + "outDir": "./dist", + "target": "ES2020" + } +} diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index b052de647..865e3f74d 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -43,19 +43,19 @@ importers: examples/blog: specifiers: - '@astrojs/renderer-preact': ^0.5.0 + '@astrojs/preact': ^0.0.1 astro: ^0.24.3 devDependencies: - '@astrojs/renderer-preact': link:../../packages/renderers/renderer-preact + '@astrojs/preact': link:../../packages/integrations/preact astro: link:../../packages/astro examples/blog-multiple-authors: specifiers: - '@astrojs/renderer-preact': ^0.5.0 + '@astrojs/preact': ^0.0.1 astro: ^0.24.3 sass: ^1.49.9 devDependencies: - '@astrojs/renderer-preact': link:../../packages/renderers/renderer-preact + '@astrojs/preact': link:../../packages/integrations/preact astro: link:../../packages/astro sass: 1.49.9 @@ -79,8 +79,8 @@ importers: examples/docs: specifiers: '@algolia/client-search': ^4.13.0 - '@astrojs/renderer-preact': ^0.5.0 - '@astrojs/renderer-react': ^0.5.0 + '@astrojs/preact': ^0.0.1 + '@astrojs/react': ^0.0.1 '@docsearch/css': ^3.0.0 '@docsearch/react': ^3.0.0 '@types/react': ^17.0.40 @@ -95,8 +95,8 @@ importers: react: 17.0.2 react-dom: 17.0.2_react@17.0.2 devDependencies: - '@astrojs/renderer-preact': link:../../packages/renderers/renderer-preact - '@astrojs/renderer-react': link:../../packages/renderers/renderer-react + '@astrojs/preact': link:../../packages/integrations/preact + '@astrojs/react': link:../../packages/integrations/react astro: link:../../packages/astro examples/env-vars: @@ -113,68 +113,86 @@ importers: examples/framework-lit: specifiers: - '@astrojs/renderer-lit': ^0.4.0 + '@astrojs/lit': ^0.0.1 astro: ^0.24.3 devDependencies: - '@astrojs/renderer-lit': link:../../packages/renderers/renderer-lit + '@astrojs/lit': link:../../packages/integrations/lit astro: link:../../packages/astro examples/framework-multiple: specifiers: - '@astrojs/renderer-lit': ^0.4.0 - '@astrojs/renderer-preact': ^0.5.0 - '@astrojs/renderer-react': ^0.5.0 - '@astrojs/renderer-solid': ^0.4.0 - '@astrojs/renderer-svelte': ^0.5.2 - '@astrojs/renderer-vue': ^0.4.0 + '@astrojs/lit': ^0.0.1 + '@astrojs/preact': ^0.0.1 + '@astrojs/react': ^0.0.1 + '@astrojs/solid-js': ^0.0.1 + '@astrojs/svelte': ^0.0.1 + '@astrojs/vue': ^0.0.1 astro: ^0.24.3 devDependencies: - '@astrojs/renderer-lit': link:../../packages/renderers/renderer-lit - '@astrojs/renderer-preact': link:../../packages/renderers/renderer-preact - '@astrojs/renderer-react': link:../../packages/renderers/renderer-react - '@astrojs/renderer-solid': link:../../packages/renderers/renderer-solid - '@astrojs/renderer-svelte': link:../../packages/renderers/renderer-svelte - '@astrojs/renderer-vue': link:../../packages/renderers/renderer-vue + '@astrojs/lit': link:../../packages/integrations/lit + '@astrojs/preact': link:../../packages/integrations/preact + '@astrojs/react': link:../../packages/integrations/react + '@astrojs/solid-js': link:../../packages/integrations/solid + '@astrojs/svelte': link:../../packages/integrations/svelte + '@astrojs/vue': link:../../packages/integrations/vue astro: link:../../packages/astro examples/framework-preact: specifiers: - '@astrojs/renderer-preact': ^0.5.0 + '@astrojs/preact': ^0.0.1 astro: ^0.24.3 devDependencies: - '@astrojs/renderer-preact': link:../../packages/renderers/renderer-preact + '@astrojs/preact': link:../../packages/integrations/preact astro: link:../../packages/astro examples/framework-react: specifiers: - '@astrojs/renderer-react': ^0.5.0 + '@astrojs/react': ^0.0.1 astro: ^0.24.3 devDependencies: - '@astrojs/renderer-react': link:../../packages/renderers/renderer-react + '@astrojs/react': link:../../packages/integrations/react astro: link:../../packages/astro examples/framework-solid: specifiers: - '@astrojs/renderer-solid': ^0.4.0 + '@astrojs/solid-js': ^0.0.1 astro: ^0.24.3 devDependencies: - '@astrojs/renderer-solid': link:../../packages/renderers/renderer-solid + '@astrojs/solid-js': link:../../packages/integrations/solid astro: link:../../packages/astro examples/framework-svelte: specifiers: - '@astrojs/renderer-svelte': ^0.5.2 + '@astrojs/svelte': ^0.0.1 astro: ^0.24.3 devDependencies: - '@astrojs/renderer-svelte': link:../../packages/renderers/renderer-svelte + '@astrojs/svelte': link:../../packages/integrations/svelte astro: link:../../packages/astro examples/framework-vue: specifiers: - '@astrojs/renderer-vue': ^0.4.0 + '@astrojs/vue': ^0.0.1 astro: ^0.24.3 devDependencies: - '@astrojs/renderer-vue': link:../../packages/renderers/renderer-vue + '@astrojs/vue': link:../../packages/integrations/vue + astro: link:../../packages/astro + + examples/integrations-playground: + specifiers: + '@astrojs/lit': ^0.0.1 + '@astrojs/partytown': ^0.0.1 + '@astrojs/react': ^0.0.1 + '@astrojs/sitemap': ^0.0.1 + '@astrojs/tailwind': ^0.0.1 + '@astrojs/turbolinks': ^0.0.1 + astro: ^0.24.3 + devDependencies: + '@astrojs/lit': link:../../packages/integrations/lit + '@astrojs/partytown': link:../../packages/integrations/partytown + '@astrojs/react': link:../../packages/integrations/react + '@astrojs/sitemap': link:../../packages/integrations/sitemap + '@astrojs/tailwind': link:../../packages/integrations/tailwind + '@astrojs/turbolinks': link:../../packages/integrations/turbolinks astro: link:../../packages/astro examples/minimal: @@ -191,24 +209,24 @@ importers: examples/portfolio: specifiers: - '@astrojs/renderer-preact': ^0.5.0 + '@astrojs/preact': ^0.0.1 astro: ^0.24.3 sass: ^1.49.9 devDependencies: - '@astrojs/renderer-preact': link:../../packages/renderers/renderer-preact + '@astrojs/preact': link:../../packages/integrations/preact astro: link:../../packages/astro sass: 1.49.9 examples/ssr: specifiers: - '@astrojs/renderer-svelte': ^0.5.2 + '@astrojs/svelte': ^0.0.1 astro: ^0.24.3 concurrently: ^7.0.0 lightcookie: ^1.0.25 unocss: ^0.15.6 vite-imagetools: ^4.0.3 devDependencies: - '@astrojs/renderer-svelte': link:../../packages/renderers/renderer-svelte + '@astrojs/svelte': link:../../packages/integrations/svelte astro: link:../../packages/astro concurrently: 7.0.0 lightcookie: 1.0.25 @@ -223,28 +241,28 @@ importers: examples/subpath: specifiers: - '@astrojs/renderer-react': ^0.5.0 + '@astrojs/react': ^0.0.1 astro: ^0.24.3 sass: ^1.49.9 devDependencies: - '@astrojs/renderer-react': link:../../packages/renderers/renderer-react + '@astrojs/react': link:../../packages/integrations/react astro: link:../../packages/astro sass: 1.49.9 examples/with-markdown: specifiers: '@astrojs/markdown-remark': ^0.6.4 - '@astrojs/renderer-preact': ^0.5.0 - '@astrojs/renderer-react': ^0.5.0 - '@astrojs/renderer-svelte': ^0.5.2 - '@astrojs/renderer-vue': ^0.4.0 + '@astrojs/preact': ^0.0.1 + '@astrojs/react': ^0.0.1 + '@astrojs/svelte': ^0.0.1 + '@astrojs/vue': ^0.0.1 astro: ^0.24.3 devDependencies: '@astrojs/markdown-remark': link:../../packages/markdown/remark - '@astrojs/renderer-preact': link:../../packages/renderers/renderer-preact - '@astrojs/renderer-react': link:../../packages/renderers/renderer-react - '@astrojs/renderer-svelte': link:../../packages/renderers/renderer-svelte - '@astrojs/renderer-vue': link:../../packages/renderers/renderer-vue + '@astrojs/preact': link:../../packages/integrations/preact + '@astrojs/react': link:../../packages/integrations/react + '@astrojs/svelte': link:../../packages/integrations/svelte + '@astrojs/vue': link:../../packages/integrations/vue astro: link:../../packages/astro examples/with-markdown-plugins: @@ -275,11 +293,11 @@ importers: examples/with-nanostores: specifiers: - '@astrojs/renderer-preact': ^0.5.0 - '@astrojs/renderer-react': ^0.5.0 - '@astrojs/renderer-solid': ^0.4.0 - '@astrojs/renderer-svelte': ^0.5.2 - '@astrojs/renderer-vue': ^0.4.0 + '@astrojs/preact': ^0.0.1 + '@astrojs/react': ^0.0.1 + '@astrojs/solid-js': ^0.0.1 + '@astrojs/svelte': ^0.0.1 + '@astrojs/vue': ^0.0.1 '@nanostores/preact': ^0.1.3 '@nanostores/react': ^0.1.5 '@nanostores/vue': ^0.4.1 @@ -301,24 +319,26 @@ importers: solid-nanostores: 0.0.6 vue: 3.2.31 devDependencies: - '@astrojs/renderer-preact': link:../../packages/renderers/renderer-preact - '@astrojs/renderer-react': link:../../packages/renderers/renderer-react - '@astrojs/renderer-solid': link:../../packages/renderers/renderer-solid - '@astrojs/renderer-svelte': link:../../packages/renderers/renderer-svelte - '@astrojs/renderer-vue': link:../../packages/renderers/renderer-vue + '@astrojs/preact': link:../../packages/integrations/preact + '@astrojs/react': link:../../packages/integrations/react + '@astrojs/solid-js': link:../../packages/integrations/solid + '@astrojs/svelte': link:../../packages/integrations/svelte + '@astrojs/vue': link:../../packages/integrations/vue astro: link:../../packages/astro examples/with-tailwindcss: specifiers: - '@astrojs/renderer-preact': ^0.5.0 + '@astrojs/tailwind': ^0.0.1 astro: ^0.24.3 autoprefixer: ^10.4.4 + canvas-confetti: ^1.5.1 postcss: ^8.4.12 tailwindcss: ^3.0.23 devDependencies: - '@astrojs/renderer-preact': link:../../packages/renderers/renderer-preact + '@astrojs/tailwind': link:../../packages/integrations/tailwind astro: link:../../packages/astro autoprefixer: 10.4.4_postcss@8.4.12 + canvas-confetti: 1.5.1 postcss: 8.4.12 tailwindcss: 3.0.23_autoprefixer@10.4.4 @@ -339,10 +359,6 @@ importers: '@astrojs/markdown-remark': ^0.6.4 '@astrojs/parser': ^0.22.2 '@astrojs/prism': 0.4.0 - '@astrojs/renderer-preact': ^0.5.0 - '@astrojs/renderer-react': 0.5.0 - '@astrojs/renderer-svelte': 0.5.2 - '@astrojs/renderer-vue': 0.4.0 '@astrojs/webapi': ^0.11.0 '@babel/core': ^7.17.7 '@babel/traverse': ^7.17.3 @@ -414,10 +430,6 @@ importers: '@astrojs/language-server': 0.8.10 '@astrojs/markdown-remark': link:../markdown/remark '@astrojs/prism': link:../astro-prism - '@astrojs/renderer-preact': link:../renderers/renderer-preact - '@astrojs/renderer-react': link:../renderers/renderer-react - '@astrojs/renderer-svelte': link:../renderers/renderer-svelte - '@astrojs/renderer-vue': link:../renderers/renderer-vue '@astrojs/webapi': link:../webapi '@babel/core': 7.17.7 '@babel/traverse': 7.17.3 @@ -510,8 +522,14 @@ importers: packages/astro/test/fixtures/0-css: specifiers: + '@astrojs/react': workspace:* + '@astrojs/svelte': workspace:* + '@astrojs/vue': workspace:* astro: workspace:* dependencies: + '@astrojs/react': link:../../../../integrations/react + '@astrojs/svelte': link:../../../../integrations/svelte + '@astrojs/vue': link:../../../../integrations/vue astro: link:../../.. packages/astro/test/fixtures/astro-assets: @@ -522,20 +540,30 @@ importers: packages/astro/test/fixtures/astro-attrs: specifiers: + '@astrojs/react': workspace:* astro: workspace:* dependencies: + '@astrojs/react': link:../../../../integrations/react astro: link:../../.. packages/astro/test/fixtures/astro-basic: specifiers: + '@astrojs/preact': workspace:* astro: workspace:* dependencies: + '@astrojs/preact': link:../../../../integrations/preact astro: link:../../.. packages/astro/test/fixtures/astro-children: specifiers: + '@astrojs/preact': workspace:* + '@astrojs/svelte': workspace:* + '@astrojs/vue': workspace:* astro: workspace:* dependencies: + '@astrojs/preact': link:../../../../integrations/preact + '@astrojs/svelte': link:../../../../integrations/svelte + '@astrojs/vue': link:../../../../integrations/vue astro: link:../../.. packages/astro/test/fixtures/astro-class-list: @@ -546,8 +574,10 @@ importers: packages/astro/test/fixtures/astro-client-only: specifiers: + '@astrojs/svelte': workspace:* astro: workspace:* dependencies: + '@astrojs/svelte': link:../../../../integrations/svelte astro: link:../../.. packages/astro/test/fixtures/astro-component-code: @@ -594,20 +624,28 @@ importers: packages/astro/test/fixtures/astro-dynamic: specifiers: + '@astrojs/react': workspace:* + '@astrojs/svelte': workspace:* astro: workspace:* dependencies: + '@astrojs/react': link:../../../../integrations/react + '@astrojs/svelte': link:../../../../integrations/svelte astro: link:../../.. packages/astro/test/fixtures/astro-envs: specifiers: + '@astrojs/vue': workspace:* astro: workspace:* dependencies: + '@astrojs/vue': link:../../../../integrations/vue astro: link:../../.. packages/astro/test/fixtures/astro-expr: specifiers: + '@astrojs/preact': workspace:* astro: workspace:* dependencies: + '@astrojs/preact': link:../../../../integrations/preact astro: link:../../.. packages/astro/test/fixtures/astro-external-files: @@ -618,8 +656,10 @@ importers: packages/astro/test/fixtures/astro-fallback: specifiers: + '@astrojs/preact': workspace:* astro: workspace:* dependencies: + '@astrojs/preact': link:../../../../integrations/preact astro: link:../../.. packages/astro/test/fixtures/astro-get-static-paths: @@ -644,8 +684,10 @@ importers: packages/astro/test/fixtures/astro-markdown: specifiers: + '@astrojs/preact': workspace:* astro: workspace:* dependencies: + '@astrojs/preact': link:../../../../integrations/preact astro: link:../../.. packages/astro/test/fixtures/astro-markdown-drafts: @@ -656,9 +698,11 @@ importers: packages/astro/test/fixtures/astro-markdown-plugins: specifiers: + '@astrojs/preact': workspace:* astro: workspace:* hast-util-select: ^5.0.1 dependencies: + '@astrojs/preact': link:../../../../integrations/preact astro: link:../../.. hast-util-select: 5.0.1 @@ -724,8 +768,10 @@ importers: packages/astro/test/fixtures/astro-partial-html: specifiers: + '@astrojs/react': workspace:* astro: workspace:* dependencies: + '@astrojs/react': link:../../../../integrations/react astro: link:../../.. packages/astro/test/fixtures/astro-public: @@ -758,24 +804,12 @@ importers: dependencies: astro: link:../../.. - packages/astro/test/fixtures/config-hostname: - specifiers: - astro: workspace:* - dependencies: - astro: link:../../.. - packages/astro/test/fixtures/config-path: specifiers: astro: workspace:* dependencies: astro: link:../../.. - packages/astro/test/fixtures/config-port: - specifiers: - astro: workspace:* - dependencies: - astro: link:../../.. - packages/astro/test/fixtures/custom-elements: specifiers: '@test/custom-element-renderer': workspace:* @@ -795,64 +829,90 @@ importers: packages/astro/test/fixtures/errors: specifiers: - '@astrojs/renderer-solid': workspace:* + '@astrojs/preact': workspace:* + '@astrojs/react': workspace:* + '@astrojs/solid-js': workspace:* + '@astrojs/svelte': workspace:* + '@astrojs/vue': workspace:* astro: workspace:* dependencies: - '@astrojs/renderer-solid': link:../../../../renderers/renderer-solid + '@astrojs/preact': link:../../../../integrations/preact + '@astrojs/react': link:../../../../integrations/react + '@astrojs/solid-js': link:../../../../integrations/solid + '@astrojs/svelte': link:../../../../integrations/svelte + '@astrojs/vue': link:../../../../integrations/vue astro: link:../../.. packages/astro/test/fixtures/fetch: specifiers: + '@astrojs/preact': workspace:* + '@astrojs/svelte': workspace:* + '@astrojs/vue': workspace:* astro: workspace:* dependencies: + '@astrojs/preact': link:../../../../integrations/preact + '@astrojs/svelte': link:../../../../integrations/svelte + '@astrojs/vue': link:../../../../integrations/vue astro: link:../../.. packages/astro/test/fixtures/legacy-build: specifiers: - '@astrojs/renderer-vue': ^0.4.0 + '@astrojs/vue': workspace:* astro: workspace:* preact: ~10.6.6 dependencies: - '@astrojs/renderer-vue': link:../../../../renderers/renderer-vue + '@astrojs/vue': link:../../../../integrations/vue astro: link:../../.. preact: 10.6.6 packages/astro/test/fixtures/lit-element: specifiers: - '@astrojs/renderer-lit': workspace:* + '@astrojs/lit': workspace:* astro: workspace:* dependencies: - '@astrojs/renderer-lit': link:../../../../renderers/renderer-lit + '@astrojs/lit': link:../../../../integrations/lit astro: link:../../.. packages/astro/test/fixtures/markdown: specifiers: + '@astrojs/preact': workspace:* astro: workspace:* dependencies: + '@astrojs/preact': link:../../../../integrations/preact astro: link:../../.. packages/astro/test/fixtures/postcss: specifiers: - '@astrojs/renderer-solid': workspace:* + '@astrojs/solid-js': workspace:* + '@astrojs/svelte': workspace:* + '@astrojs/vue': workspace:* astro: workspace:* autoprefixer: ^10.4.4 postcss: ^8.4.12 dependencies: - '@astrojs/renderer-solid': link:../../../../renderers/renderer-solid + '@astrojs/solid-js': link:../../../../integrations/solid + '@astrojs/svelte': link:../../../../integrations/svelte + '@astrojs/vue': link:../../../../integrations/vue astro: link:../../.. autoprefixer: 10.4.4_postcss@8.4.12 postcss: 8.4.12 packages/astro/test/fixtures/preact-component: specifiers: + '@astrojs/preact': workspace:* astro: workspace:* dependencies: + '@astrojs/preact': link:../../../../integrations/preact astro: link:../../.. packages/astro/test/fixtures/react-component: specifiers: + '@astrojs/react': workspace:* + '@astrojs/vue': workspace:* astro: workspace:* dependencies: + '@astrojs/react': link:../../../../integrations/react + '@astrojs/vue': link:../../../../integrations/vue astro: link:../../.. packages/astro/test/fixtures/remote-css: @@ -877,49 +937,59 @@ importers: packages/astro/test/fixtures/slots-preact: specifiers: + '@astrojs/preact': workspace:* astro: workspace:* dependencies: + '@astrojs/preact': link:../../../../integrations/preact astro: link:../../.. packages/astro/test/fixtures/slots-react: specifiers: + '@astrojs/react': workspace:* astro: workspace:* dependencies: + '@astrojs/react': link:../../../../integrations/react astro: link:../../.. packages/astro/test/fixtures/slots-solid: specifiers: - '@astrojs/renderer-solid': workspace:* + '@astrojs/solid-js': workspace:* astro: workspace:* dependencies: - '@astrojs/renderer-solid': link:../../../../renderers/renderer-solid + '@astrojs/solid-js': link:../../../../integrations/solid astro: link:../../.. packages/astro/test/fixtures/slots-svelte: specifiers: + '@astrojs/svelte': workspace:* astro: workspace:* dependencies: + '@astrojs/svelte': link:../../../../integrations/svelte astro: link:../../.. packages/astro/test/fixtures/slots-vue: specifiers: + '@astrojs/vue': workspace:* astro: workspace:* dependencies: + '@astrojs/vue': link:../../../../integrations/vue astro: link:../../.. packages/astro/test/fixtures/solid-component: specifiers: - '@astrojs/renderer-solid': workspace:* + '@astrojs/solid-js': workspace:* astro: workspace:* dependencies: - '@astrojs/renderer-solid': link:../../../../renderers/renderer-solid + '@astrojs/solid-js': link:../../../../integrations/solid astro: link:../../.. packages/astro/test/fixtures/static build: specifiers: + '@astrojs/preact': workspace:* '@test/static-build-pkg': workspace:* astro: workspace:* dependencies: + '@astrojs/preact': link:../../../../integrations/preact '@test/static-build-pkg': link:pkg astro: link:../../.. @@ -934,8 +1004,12 @@ importers: packages/astro/test/fixtures/static-build-frameworks: specifiers: + '@astrojs/preact': workspace:* + '@astrojs/react': workspace:* astro: workspace:* dependencies: + '@astrojs/preact': link:../../../../integrations/preact + '@astrojs/react': link:../../../../integrations/react astro: link:../../.. packages/astro/test/fixtures/static-build-page-url-format: @@ -946,17 +1020,21 @@ importers: packages/astro/test/fixtures/svelte-component: specifiers: + '@astrojs/svelte': workspace:* astro: workspace:* dependencies: + '@astrojs/svelte': link:../../../../integrations/svelte astro: link:../../.. packages/astro/test/fixtures/tailwindcss: specifiers: + '@astrojs/tailwind': workspace:* astro: workspace:* autoprefixer: ^10.4.4 postcss: ^8.4.12 tailwindcss: ^3.0.23 dependencies: + '@astrojs/tailwind': link:../../../../integrations/tailwind astro: link:../../.. autoprefixer: 10.4.4_postcss@8.4.12 postcss: 8.4.12 @@ -964,8 +1042,10 @@ importers: packages/astro/test/fixtures/vue-component: specifiers: + '@astrojs/vue': workspace:* astro: workspace:* dependencies: + '@astrojs/vue': link:../../../../integrations/vue astro: link:../../.. packages/astro/test/fixtures/with-endpoint-routes: @@ -980,24 +1060,12 @@ importers: dependencies: astro: link:../../.. - packages/astro/test/fixtures/with-subpath-trailing-slash: - specifiers: - astro: workspace:* - dependencies: - astro: link:../../.. - packages/astro/test/fixtures/without-site-config: specifiers: astro: workspace:* dependencies: astro: link:../../.. - packages/astro/test/fixtures/without-subpath: - specifiers: - astro: workspace:* - dependencies: - astro: link:../../.. - packages/create-astro: specifiers: '@types/degit': ^2.8.3 @@ -1023,6 +1091,142 @@ importers: astro-scripts: link:../../scripts uvu: 0.5.3 + packages/integrations/lit: + specifiers: + '@lit-labs/ssr': ^2.0.2 + astro: workspace:* + astro-scripts: workspace:* + dependencies: + '@lit-labs/ssr': 2.0.4 + devDependencies: + astro: link:../../astro + astro-scripts: link:../../../scripts + + packages/integrations/partytown: + specifiers: + '@builder.io/partytown': ^0.4.0 + astro: workspace:* + astro-scripts: workspace:* + mrmime: ^1.0.0 + dependencies: + '@builder.io/partytown': 0.4.5 + mrmime: 1.0.0 + devDependencies: + astro: link:../../astro + astro-scripts: link:../../../scripts + + packages/integrations/preact: + specifiers: + '@babel/plugin-transform-react-jsx': ^7.16.7 + astro: workspace:* + astro-scripts: workspace:* + preact: ^10.6.5 + preact-render-to-string: ^5.1.19 + dependencies: + '@babel/plugin-transform-react-jsx': 7.17.3 + preact-render-to-string: 5.1.20_preact@10.6.6 + devDependencies: + astro: link:../../astro + astro-scripts: link:../../../scripts + preact: 10.6.6 + + packages/integrations/react: + specifiers: + '@babel/plugin-transform-react-jsx': ^7.16.7 + astro: workspace:* + astro-scripts: workspace:* + react: ^17.0.2 + react-dom: ^17.0.2 + dependencies: + '@babel/plugin-transform-react-jsx': 7.17.3 + devDependencies: + astro: link:../../astro + astro-scripts: link:../../../scripts + react: 17.0.2 + react-dom: 17.0.2_react@17.0.2 + + packages/integrations/sitemap: + specifiers: + astro: workspace:* + astro-scripts: workspace:* + sitemap: ^7.1.1 + dependencies: + sitemap: 7.1.1 + devDependencies: + astro: link:../../astro + astro-scripts: link:../../../scripts + + packages/integrations/solid: + specifiers: + astro: workspace:* + astro-scripts: workspace:* + babel-preset-solid: ^1.3.6 + solid-js: ^1.3.6 + dependencies: + babel-preset-solid: 1.3.13 + devDependencies: + astro: link:../../astro + astro-scripts: link:../../../scripts + solid-js: 1.3.13 + + packages/integrations/svelte: + specifiers: + '@sveltejs/vite-plugin-svelte': ^1.0.0-next.37 + astro: workspace:* + astro-scripts: workspace:* + postcss-load-config: ^3.1.1 + svelte: ^3.46.4 + svelte-preprocess: ^4.10.2 + dependencies: + '@sveltejs/vite-plugin-svelte': 1.0.0-next.39_svelte@3.46.4 + postcss-load-config: 3.1.3 + svelte-preprocess: 4.10.4_7144bccf0a8de43f5976a510f9dc7703 + devDependencies: + astro: link:../../astro + astro-scripts: link:../../../scripts + svelte: 3.46.4 + + packages/integrations/tailwind: + specifiers: + '@types/tailwindcss': ^3.0.9 + astro: workspace:* + astro-scripts: workspace:* + autoprefixer: ^10.4.4 + postcss: ^8.4.12 + tailwindcss: ^3.0.23 + dependencies: + autoprefixer: 10.4.4_postcss@8.4.12 + postcss: 8.4.12 + tailwindcss: 3.0.23_autoprefixer@10.4.4 + devDependencies: + '@types/tailwindcss': 3.0.9 + astro: link:../../astro + astro-scripts: link:../../../scripts + + packages/integrations/turbolinks: + specifiers: + astro: workspace:* + astro-scripts: workspace:* + turbolinks: ^5.2.0 + dependencies: + turbolinks: 5.2.0 + devDependencies: + astro: link:../../astro + astro-scripts: link:../../../scripts + + packages/integrations/vue: + specifiers: + '@vitejs/plugin-vue': ^2.2.0 + astro: workspace:* + astro-scripts: workspace:* + vue: ^3.2.30 + dependencies: + '@vitejs/plugin-vue': 2.2.4_vue@3.2.31 + devDependencies: + astro: link:../../astro + astro-scripts: link:../../../scripts + vue: 3.2.31 + packages/markdown/remark: specifiers: '@astrojs/prism': ^0.4.0 @@ -2719,6 +2923,11 @@ packages: '@babel/helper-validator-identifier': 7.16.7 to-fast-properties: 2.0.0 + /@builder.io/partytown/0.4.5: + resolution: {integrity: sha512-HcHlmMYSpOxfJ0lFVxgZrvgIjz1Q8knlGuWkBpvjIp68j+xVWg969+sn7BCfyKhcGaYlnVOY/CEBHapQBcl0jw==} + hasBin: true + dev: false + /@changesets/apply-release-plan/5.0.5: resolution: {integrity: sha512-CxL9dkhzjHiVmXCyHgsLCQj7i/coFTMv/Yy0v6BC5cIWZkQml+lf7zvQqAcFXwY7b54HxRWZPku02XFB53Q0Uw==} dependencies: @@ -3381,6 +3590,29 @@ packages: string.prototype.matchall: 4.0.6 dev: true + /@sveltejs/vite-plugin-svelte/1.0.0-next.39_svelte@3.46.4: + resolution: {integrity: sha512-gnvvcAW2LK+KnUn8lKb2ypcXKwSp2K57mem5C4VNKfjxdRpM6+XwNavWwVf6otnDhz3qPYl/TKKW6/dRr6eeAw==} + engines: {node: ^14.13.1 || >= 16} + peerDependencies: + diff-match-patch: ^1.0.5 + svelte: ^3.44.0 + vite: ^2.7.0 + peerDependenciesMeta: + diff-match-patch: + optional: true + vite: + optional: true + dependencies: + '@rollup/pluginutils': 4.2.0 + debug: 4.3.3 + kleur: 4.1.4 + magic-string: 0.25.9 + svelte: 3.46.4 + svelte-hmr: 0.14.11_svelte@3.46.4 + transitivePeerDependencies: + - supports-color + dev: false + /@sveltejs/vite-plugin-svelte/1.0.0-next.39_svelte@3.46.4+vite@2.8.6: resolution: {integrity: sha512-gnvvcAW2LK+KnUn8lKb2ypcXKwSp2K57mem5C4VNKfjxdRpM6+XwNavWwVf6otnDhz3qPYl/TKKW6/dRr6eeAw==} engines: {node: ^14.13.1 || >= 16} @@ -3639,6 +3871,12 @@ packages: '@types/node': 17.0.21 dev: false + /@types/sax/1.2.4: + resolution: {integrity: sha512-pSAff4IAxJjfAXUG6tFkO7dsSbTmf8CtUpfhhZ5VhkRpC4628tJhh3+V6H1E+/Gs9piSzYKT5yzHO5M4GG9jkw==} + dependencies: + '@types/node': 17.0.21 + dev: false + /@types/scheduler/0.16.2: resolution: {integrity: sha512-hppQEBDmlwhFAXKJX2KnWLYu5yMfi91yazPb2l+lbJiwW+wdo1gNeRA+3RgNSO39WYX2euey41KEwnqesU2Jew==} dev: false @@ -3654,6 +3892,10 @@ packages: '@types/node': 17.0.21 dev: true + /@types/tailwindcss/3.0.9: + resolution: {integrity: sha512-uZjNKNjlA6cr6py/GWsDjevJb/Bl0fmaMNUdIpNMW3TJGJzxN9O6uFWx97LiSK7ithWNrrDSytq1FdvHpgSvWg==} + dev: true + /@types/throttle-debounce/2.1.0: resolution: {integrity: sha512-5eQEtSCoESnh2FsiLTxE121IiE60hnMqcb435fShf4bpLRjEu1Eoekht23y6zXS9Ts3l+Szu3TARnTsA0GkOkQ==} dev: true @@ -3906,6 +4148,19 @@ packages: vue: 3.2.31 dev: false + /@vitejs/plugin-vue/2.2.4_vue@3.2.31: + resolution: {integrity: sha512-ev9AOlp0ljCaDkFZF3JwC/pD2N4Hh+r5srl5JHM6BKg5+99jiiK0rE/XaRs3pVm1wzyKkjUy/StBSoXX5fFzcw==} + engines: {node: '>=12.0.0'} + peerDependencies: + vite: ^2.5.10 + vue: ^3.2.25 + peerDependenciesMeta: + vite: + optional: true + dependencies: + vue: 3.2.31 + dev: false + /@vue/compiler-core/3.2.31: resolution: {integrity: sha512-aKno00qoA4o+V/kR6i/pE+aP+esng5siNAVQ422TkBNM6qA4veXiZbSe8OTXHXquEi/f6Akc+nLfB4JGfe4/WQ==} dependencies: @@ -3913,14 +4168,12 @@ packages: '@vue/shared': 3.2.31 estree-walker: 2.0.2 source-map: 0.6.1 - dev: false /@vue/compiler-dom/3.2.31: resolution: {integrity: sha512-60zIlFfzIDf3u91cqfqy9KhCKIJgPeqxgveH2L+87RcGU/alT6BRrk5JtUso0OibH3O7NXuNOQ0cDc9beT0wrg==} dependencies: '@vue/compiler-core': 3.2.31 '@vue/shared': 3.2.31 - dev: false /@vue/compiler-sfc/3.2.31: resolution: {integrity: sha512-748adc9msSPGzXgibHiO6T7RWgfnDcVQD+VVwYgSsyyY8Ans64tALHZANrKtOzvkwznV/F4H7OAod/jIlp/dkQ==} @@ -3935,14 +4188,12 @@ packages: magic-string: 0.25.9 postcss: 8.4.12 source-map: 0.6.1 - dev: false /@vue/compiler-ssr/3.2.31: resolution: {integrity: sha512-mjN0rqig+A8TVDnsGPYJM5dpbjlXeHUm2oZHZwGyMYiGT/F4fhJf/cXy8QpjnLQK4Y9Et4GWzHn9PS8AHUnSkw==} dependencies: '@vue/compiler-dom': 3.2.31 '@vue/shared': 3.2.31 - dev: false /@vue/reactivity-transform/3.2.31: resolution: {integrity: sha512-uS4l4z/W7wXdI+Va5pgVxBJ345wyGFKvpPYtdSgvfJfX/x2Ymm6ophQlXXB6acqGHtXuBqNyyO3zVp9b1r0MOA==} @@ -3952,20 +4203,17 @@ packages: '@vue/shared': 3.2.31 estree-walker: 2.0.2 magic-string: 0.25.9 - dev: false /@vue/reactivity/3.2.31: resolution: {integrity: sha512-HVr0l211gbhpEKYr2hYe7hRsV91uIVGFYNHj73njbARVGHQvIojkImKMaZNDdoDZOIkMsBc9a1sMqR+WZwfSCw==} dependencies: '@vue/shared': 3.2.31 - dev: false /@vue/runtime-core/3.2.31: resolution: {integrity: sha512-Kcog5XmSY7VHFEMuk4+Gap8gUssYMZ2+w+cmGI6OpZWYOEIcbE0TPzzPHi+8XTzAgx1w/ZxDFcXhZeXN5eKWsA==} dependencies: '@vue/reactivity': 3.2.31 '@vue/shared': 3.2.31 - dev: false /@vue/runtime-dom/3.2.31: resolution: {integrity: sha512-N+o0sICVLScUjfLG7u9u5XCjvmsexAiPt17GNnaWHJUfsKed5e85/A3SWgKxzlxx2SW/Hw7RQxzxbXez9PtY3g==} @@ -3973,7 +4221,6 @@ packages: '@vue/runtime-core': 3.2.31 '@vue/shared': 3.2.31 csstype: 2.6.20 - dev: false /@vue/server-renderer/3.2.31_vue@3.2.31: resolution: {integrity: sha512-8CN3Zj2HyR2LQQBHZ61HexF5NReqngLT3oahyiVRfSSvak+oAvVmu8iNLSu6XR77Ili2AOpnAt1y8ywjjqtmkg==} @@ -3983,11 +4230,9 @@ packages: '@vue/compiler-ssr': 3.2.31 '@vue/shared': 3.2.31 vue: 3.2.31 - dev: false /@vue/shared/3.2.31: resolution: {integrity: sha512-ymN2pj6zEjiKJZbrf98UM2pfDd6F2H7ksKw7NDt/ZZ1fh5Ei39X5tABugtT03ZRlWd9imccoK0hE8hpjpU7irQ==} - dev: false /@web/parse5-utils/1.3.0: resolution: {integrity: sha512-Pgkx3ECc8EgXSlS5EyrgzSOoUbM6P8OKS471HLAyvOBcP1NCBn0to4RN/OaKASGq8qa3j+lPX9H14uA5AHEnQg==} @@ -4439,6 +4684,10 @@ packages: /caniuse-lite/1.0.30001317: resolution: {integrity: sha512-xIZLh8gBm4dqNX0gkzrBeyI86J2eCjWzYAs40q88smG844YIrN4tVQl/RhquHvKEKImWWFIVh1Lxe5n1G/N+GQ==} + /canvas-confetti/1.5.1: + resolution: {integrity: sha512-Ncz+oZJP6OvY7ti4E1slxVlyAV/3g7H7oQtcCDXgwGgARxPnwYY9PW5Oe+I8uvspYNtuHviAdgA0LfcKFWJfpg==} + dev: true + /ccount/2.0.1: resolution: {integrity: sha512-eyrF0jiFpY+3drT6383f1qhkbGsLSifNAjA61IUjZjmLCWjItY6LB9ft9YhoDgwfmclB2zhu51Lc7+95b8NRAg==} dev: false @@ -4738,7 +4987,6 @@ packages: /csstype/2.6.20: resolution: {integrity: sha512-/WwNkdXfckNgw6S5R125rrW8ez139lBHWouiBvX8dfMFtcn6V81REDqnH7+CRpRipfYlyU1CmOnOxrmGcFOjeA==} - dev: false /csstype/3.0.11: resolution: {integrity: sha512-sa6P2wJ+CAbgyy4KFssIb/JNMLxFvKF1pCYCSXS8ZMuqZnMsrxqI2E5sPyoTpxoPU/gVZMzr2zjOfg8GIZOMsw==} @@ -6952,7 +7200,6 @@ packages: hasBin: true dependencies: js-tokens: 4.0.0 - dev: false /loupe/2.3.4: resolution: {integrity: sha512-OvKfgCC2Ndby6aSTREl5aCCPTNIzlDfQZvZxNUrBrihDhL3xcrYegTblhmEiCrg2kKQz4XsFIaemE5BF4ybSaQ==} @@ -8064,7 +8311,6 @@ packages: /preact/10.6.6: resolution: {integrity: sha512-dgxpTFV2vs4vizwKohYKkk7g7rmp1wOOcfd4Tz3IB3Wi+ivZzsn/SpeKJhRENSE+n8sUfsAl4S3HiCVT923ABw==} - dev: false /prebuild-install/7.0.1: resolution: {integrity: sha512-QBSab31WqkyxpnMWQxubYAHR5S9B2+r81ucocew34Fkl98FhvKIF50jIJnNOBmAZfyNV7vE5T6gd3hTVWgY6tg==} @@ -8240,7 +8486,6 @@ packages: object-assign: 4.1.1 react: 17.0.2 scheduler: 0.20.2 - dev: false /react/17.0.2: resolution: {integrity: sha512-gnhPt75i/dq/z3/6q/0asP78D0u592D5L1pd7M8P+dck6Fu/jJeL6iVVK23fptSUZj8Vjf++7wXA8UNclGQcbA==} @@ -8248,7 +8493,6 @@ packages: dependencies: loose-envify: 1.4.0 object-assign: 4.1.1 - dev: false /read-pkg-up/7.0.1: resolution: {integrity: sha512-zK0TB7Xd6JpCLmlLmufqykGE+/TlOePD6qKClNW7hHDKFh/J7/7gCWGR7joEQEW1bKq3a3yUZSObOoWLFQ4ohg==} @@ -8620,12 +8864,15 @@ packages: immutable: 4.0.0 source-map-js: 1.0.2 + /sax/1.2.4: + resolution: {integrity: sha512-NqVDv9TpANUjFm0N8uM5GxL36UgKi9/atZw+x7YFnQ8ckwFGKrl4xX4yWtrey3UJm5nP1kUbnYgLopqWNSRhWw==} + dev: false + /scheduler/0.20.2: resolution: {integrity: sha512-2eWfGgAqqWFGqtdMmcL5zCMK1U8KlXv8SQFGglL3CEtd0aDVDWgeF/YoCmvln55m5zSk3J/20hTaSBeSObsQDQ==} dependencies: loose-envify: 1.4.0 object-assign: 4.1.1 - dev: false /section-matter/1.0.0: resolution: {integrity: sha512-vfD3pmTzGpufjScBh50YHKzEu2lxBWhVEHsNGoEXmCmn2hKGfeNLYMzCJpe8cD7gqX7TJluOVpBkAequ6dgMmA==} @@ -8777,6 +9024,17 @@ packages: resolution: {integrity: sha512-bLGGlR1QxBcynn2d5YmDX4MGjlZvy2MRBDRNHLJ8VI6l6+9FUiyTFNJ0IveOSP0bcXgVDPRcfGqA0pjaqUpfVg==} dev: false + /sitemap/7.1.1: + resolution: {integrity: sha512-mK3aFtjz4VdJN0igpIJrinf3EO8U8mxOPsTBzSsy06UtjZQJ3YY3o3Xa7zSc5nMqcMrRwlChHZ18Kxg0caiPBg==} + engines: {node: '>=12.0.0', npm: '>=5.6.0'} + hasBin: true + dependencies: + '@types/node': 17.0.21 + '@types/sax': 1.2.4 + arg: 5.0.1 + sax: 1.2.4 + dev: false + /slash/3.0.0: resolution: {integrity: sha512-g9Q1haeby36OSStwb4ntCGGGaKsaVSjQ68fBxoQcutl5fS1vuY18H3wSt3jFyFtrkx+Kz0V1G85A4MyAdDMi2Q==} engines: {node: '>=8'} @@ -8825,7 +9083,6 @@ packages: /solid-js/1.3.13: resolution: {integrity: sha512-1EBEIW9u2yqT5QNjFdvz/tMAoKsDdaRA2Jbgykd2Dt13Ia0D4mV+BFvPkOaseSyu7DsMKS23+ZZofV8BVKmpuQ==} - dev: false /solid-nanostores/0.0.6: resolution: {integrity: sha512-iwbgdBzQSxBKoxkzaZgC9MGGUsHWJ74at9i7FF0naoqtwGuKdLYOgOJ9QRlA353DHDS/ttH2e0SRS6s3gz8NLQ==} @@ -9131,6 +9388,58 @@ packages: svelte: 3.46.4 dev: false + /svelte-preprocess/4.10.4_7144bccf0a8de43f5976a510f9dc7703: + resolution: {integrity: sha512-fuwol0N4UoHsNQolLFbMqWivqcJ9N0vfWO9IuPAiX/5okfoGXURyJ6nECbuEIv0nU3M8Xe2I1ONNje2buk7l6A==} + engines: {node: '>= 9.11.2'} + requiresBuild: true + peerDependencies: + '@babel/core': ^7.10.2 + coffeescript: ^2.5.1 + less: ^3.11.3 || ^4.0.0 + node-sass: '*' + postcss: ^7 || ^8 + postcss-load-config: ^2.1.0 || ^3.0.0 + pug: ^3.0.0 + sass: ^1.26.8 + stylus: ^0.55.0 + sugarss: ^2.0.0 + svelte: ^3.23.0 + typescript: ^3.9.5 || ^4.0.0 + peerDependenciesMeta: + '@babel/core': + optional: true + coffeescript: + optional: true + less: + optional: true + node-sass: + optional: true + postcss: + optional: true + postcss-load-config: + optional: true + pug: + optional: true + sass: + optional: true + stylus: + optional: true + sugarss: + optional: true + typescript: + optional: true + dependencies: + '@types/pug': 2.0.6 + '@types/sass': 1.43.1 + detect-indent: 6.1.0 + magic-string: 0.25.9 + postcss-load-config: 3.1.3 + sorcery: 0.10.0 + strip-indent: 3.0.0 + svelte: 3.46.4 + typescript: 4.6.2 + dev: false + /svelte-preprocess/4.10.4_svelte@3.46.4+typescript@4.6.2: resolution: {integrity: sha512-fuwol0N4UoHsNQolLFbMqWivqcJ9N0vfWO9IuPAiX/5okfoGXURyJ6nECbuEIv0nU3M8Xe2I1ONNje2buk7l6A==} engines: {node: '>= 9.11.2'} @@ -9185,7 +9494,6 @@ packages: /svelte/3.46.4: resolution: {integrity: sha512-qKJzw6DpA33CIa+C/rGp4AUdSfii0DOTCzj/2YpSKKayw5WGSS624Et9L1nU1k2OVRS9vaENQXp2CVZNU+xvIg==} engines: {node: '>= 8'} - dev: false /tailwindcss/3.0.23_autoprefixer@10.4.4: resolution: {integrity: sha512-+OZOV9ubyQ6oI2BXEhzw4HrqvgcARY38xv3zKcjnWtMIZstEsXdI9xftd1iB7+RbOnj2HOEzkA0OyB5BaSxPQA==} @@ -9525,6 +9833,10 @@ packages: turbo-windows-64: 1.1.6 dev: true + /turbolinks/5.2.0: + resolution: {integrity: sha512-pMiez3tyBo6uRHFNNZoYMmrES/IaGgMhQQM+VFF36keryjb5ms0XkVpmKHkfW/4Vy96qiGW3K9bz0tF5sK9bBw==} + dev: false + /type-check/0.3.2: resolution: {integrity: sha1-WITKtRLPHTVeP7eE8wgEsrUg23I=} engines: {node: '>= 0.8.0'} @@ -10009,7 +10321,6 @@ packages: '@vue/runtime-dom': 3.2.31 '@vue/server-renderer': 3.2.31_vue@3.2.31 '@vue/shared': 3.2.31 - dev: false /wcwidth/1.0.1: resolution: {integrity: sha1-8LDc+RW8X/FSivrbLA4XtTLaL+g=} diff --git a/scripts/cmd/build.js b/scripts/cmd/build.js index 6dd78f4fa..3a182c656 100644 --- a/scripts/cmd/build.js +++ b/scripts/cmd/build.js @@ -39,11 +39,10 @@ export default async function build(...args) { await esbuild.build({ ...config, sourcemap: false, - bundle: entryPoints.length === 1, // Note: only use `bundle` with a single entrypoint! + bundle: false, entryPoints, outdir, format, - plugins: [svelte({ isDev })], }); return; } diff --git a/scripts/memory/index.js b/scripts/memory/index.js index 70ea6955d..969b1bb17 100644 --- a/scripts/memory/index.js +++ b/scripts/memory/index.js @@ -60,7 +60,7 @@ const endSize = v8.getHeapStatistics().used_heap_size; // If the trailing average is higher than the median, see if it's more than 5% higher let percentage = endSize / startSize; -const TEST_THRESHOLD = 1.2; +const TEST_THRESHOLD = 1.5; const isPass = percentage < TEST_THRESHOLD; console.log(``); console.log(`Result: ${isPass ? 'PASS' : 'FAIL'} (${percentage * 100}%)`);