From 09908383502f34ac4edab73f3f72847d7eb4ea7c Mon Sep 17 00:00:00 2001 From: Rich Harris Date: Mon, 3 May 2021 18:17:11 -0400 Subject: [PATCH 01/17] .svelte -> .svelte-kit --- packages/kit/.gitignore | 4 ++-- packages/kit/src/core/adapt/prerender.js | 3 ++- .../output/client/routes/index.js | 0 .../{.svelte => .svelte-kit}/output/server/app.js | 0 .../{.svelte => .svelte-kit}/output/server/app.js | 0 packages/kit/src/core/adapt/test/index.js | 11 +++++++++-- packages/kit/src/core/adapt/utils.js | 5 +++-- packages/kit/src/core/build/index.js | 9 +++++---- packages/kit/src/core/constants.js | 1 + packages/kit/src/core/dev/index.js | 5 +++-- packages/kit/src/core/start/index.js | 5 +++-- 11 files changed, 28 insertions(+), 15 deletions(-) rename packages/kit/src/core/adapt/test/fixtures/basic/{.svelte => .svelte-kit}/output/client/routes/index.js (100%) rename packages/kit/src/core/adapt/test/fixtures/basic/{.svelte => .svelte-kit}/output/server/app.js (100%) rename packages/kit/src/core/adapt/test/fixtures/prerender/{.svelte => .svelte-kit}/output/server/app.js (100%) create mode 100644 packages/kit/src/core/constants.js diff --git a/packages/kit/.gitignore b/packages/kit/.gitignore index 3161c09aa09f..9c7349f74e5f 100644 --- a/packages/kit/.gitignore +++ b/packages/kit/.gitignore @@ -3,6 +3,6 @@ /dist /assets/runtime /client/**/*.d.ts -/test/**/.svelte +/test/**/.svelte-kit /test/**/build -!/src/api/adapt/test/fixtures/*/.svelte \ No newline at end of file +!/src/api/adapt/test/fixtures/*/.svelte-kit diff --git a/packages/kit/src/core/adapt/prerender.js b/packages/kit/src/core/adapt/prerender.js index d2cfea496097..db52c5245478 100644 --- a/packages/kit/src/core/adapt/prerender.js +++ b/packages/kit/src/core/adapt/prerender.js @@ -3,6 +3,7 @@ import { dirname, join, resolve as resolve_path } from 'path'; import { parse, pathToFileURL, resolve } from 'url'; import { mkdirp } from '../filesystem/index.js'; import '../../install-fetch.js'; +import { SVELTE_KIT } from '../constants.js'; /** @param {string} html */ function clean_html(html) { @@ -57,7 +58,7 @@ const REDIRECT = 3; * all: boolean; // disregard `export const prerender = true` * }} opts */ export async function prerender({ cwd, out, log, config, build_data, fallback, all }) { - const dir = resolve_path(cwd, '.svelte/output'); + const dir = resolve_path(cwd, `${SVELTE_KIT}/output`); const seen = new Set(); diff --git a/packages/kit/src/core/adapt/test/fixtures/basic/.svelte/output/client/routes/index.js b/packages/kit/src/core/adapt/test/fixtures/basic/.svelte-kit/output/client/routes/index.js similarity index 100% rename from packages/kit/src/core/adapt/test/fixtures/basic/.svelte/output/client/routes/index.js rename to packages/kit/src/core/adapt/test/fixtures/basic/.svelte-kit/output/client/routes/index.js diff --git a/packages/kit/src/core/adapt/test/fixtures/basic/.svelte/output/server/app.js b/packages/kit/src/core/adapt/test/fixtures/basic/.svelte-kit/output/server/app.js similarity index 100% rename from packages/kit/src/core/adapt/test/fixtures/basic/.svelte/output/server/app.js rename to packages/kit/src/core/adapt/test/fixtures/basic/.svelte-kit/output/server/app.js diff --git a/packages/kit/src/core/adapt/test/fixtures/prerender/.svelte/output/server/app.js b/packages/kit/src/core/adapt/test/fixtures/prerender/.svelte-kit/output/server/app.js similarity index 100% rename from packages/kit/src/core/adapt/test/fixtures/prerender/.svelte/output/server/app.js rename to packages/kit/src/core/adapt/test/fixtures/prerender/.svelte-kit/output/server/app.js diff --git a/packages/kit/src/core/adapt/test/index.js b/packages/kit/src/core/adapt/test/index.js index 775381995c3a..8650927a4093 100644 --- a/packages/kit/src/core/adapt/test/index.js +++ b/packages/kit/src/core/adapt/test/index.js @@ -5,6 +5,7 @@ import rimraf from 'rimraf'; import glob from 'tiny-glob/sync.js'; import { get_utils } from '../utils.js'; import { fileURLToPath } from 'url'; +import { SVELTE_KIT } from '../../constants.js'; const __filename = fileURLToPath(import.meta.url); const __dirname = join(__filename, '..'); @@ -53,12 +54,18 @@ suite('copy files', () => { rimraf.sync(dest); utils.copy_client_files(dest); - assert.equal(glob('**', { cwd: `${cwd}/.svelte/output/client` }), glob('**', { cwd: dest })); + assert.equal( + glob('**', { cwd: `${cwd}/${SVELTE_KIT}/output/client` }), + glob('**', { cwd: dest }) + ); rimraf.sync(dest); utils.copy_server_files(dest); - assert.equal(glob('**', { cwd: `${cwd}/.svelte/output/server` }), glob('**', { cwd: dest })); + assert.equal( + glob('**', { cwd: `${cwd}/${SVELTE_KIT}/output/server` }), + glob('**', { cwd: dest }) + ); }); suite('prerender', async () => { diff --git a/packages/kit/src/core/adapt/utils.js b/packages/kit/src/core/adapt/utils.js index bf84b7c1c30e..21ee6822b0f4 100644 --- a/packages/kit/src/core/adapt/utils.js +++ b/packages/kit/src/core/adapt/utils.js @@ -1,3 +1,4 @@ +import { SVELTE_KIT } from '../constants.js'; import { copy, rimraf, mkdirp } from '../filesystem/index.js'; import { prerender } from './prerender.js'; @@ -20,12 +21,12 @@ export function get_utils({ cwd, config, build_data, log }) { /** @param {string} dest */ copy_client_files(dest) { - copy(`${cwd}/.svelte/output/client`, dest, (file) => file[0] !== '.'); + copy(`${cwd}/${SVELTE_KIT}/output/client`, dest, (file) => file[0] !== '.'); }, /** @param {string} dest */ copy_server_files(dest) { - copy(`${cwd}/.svelte/output/server`, dest, (file) => file[0] !== '.'); + copy(`${cwd}/${SVELTE_KIT}/output/server`, dest, (file) => file[0] !== '.'); }, /** @param {string} dest */ diff --git a/packages/kit/src/core/build/index.js b/packages/kit/src/core/build/index.js index 3ce0bfa6bb78..8ffe3e740b84 100644 --- a/packages/kit/src/core/build/index.js +++ b/packages/kit/src/core/build/index.js @@ -7,6 +7,7 @@ import { create_app } from '../../core/create_app/index.js'; import vite from 'vite'; import svelte from '@sveltejs/vite-plugin-svelte'; import glob from 'tiny-glob/sync.js'; +import { SVELTE_KIT } from '../constants.js'; /** @param {any} value */ const s = (value) => JSON.stringify(value); @@ -26,11 +27,11 @@ const s = (value) => JSON.stringify(value); * @returns {Promise} */ export async function build(config, { cwd = process.cwd(), runtime = '@sveltejs/kit/ssr' } = {}) { - const build_dir = path.resolve(cwd, '.svelte/build'); + const build_dir = path.resolve(cwd, `${SVELTE_KIT}/build`); rimraf(build_dir); - const output_dir = path.resolve(cwd, '.svelte/output'); + const output_dir = path.resolve(cwd, `${SVELTE_KIT}/output`); const options = { cwd, @@ -46,7 +47,7 @@ export async function build(config, { cwd = process.cwd(), runtime = '@sveltejs/ cwd }), output_dir, - client_entry_file: '.svelte/build/runtime/internal/start.js', + client_entry_file: `${SVELTE_KIT}/build/runtime/internal/start.js`, service_worker_entry_file: resolve_entry(config.kit.files.serviceWorker) }; @@ -199,7 +200,7 @@ async function build_server( ) { let hooks_file = resolve_entry(config.kit.files.hooks); if (!fs.existsSync(hooks_file)) { - hooks_file = path.resolve(cwd, '.svelte/build/hooks.js'); + hooks_file = path.resolve(cwd, `${SVELTE_KIT}/build/hooks.js`); fs.writeFileSync(hooks_file, ''); } diff --git a/packages/kit/src/core/constants.js b/packages/kit/src/core/constants.js new file mode 100644 index 000000000000..a2209edff193 --- /dev/null +++ b/packages/kit/src/core/constants.js @@ -0,0 +1 @@ +export const SVELTE_KIT = '.svelte-kit'; diff --git a/packages/kit/src/core/dev/index.js b/packages/kit/src/core/dev/index.js index ce45a4b1db54..5223cfa654dc 100644 --- a/packages/kit/src/core/dev/index.js +++ b/packages/kit/src/core/dev/index.js @@ -15,6 +15,7 @@ import { copy_assets, get_no_external, resolve_entry } from '../utils.js'; import svelte from '@sveltejs/vite-plugin-svelte'; import { get_server } from '../server/index.js'; import '../../install-fetch.js'; +import { SVELTE_KIT } from '../constants.js'; /** @typedef {{ cwd?: string, port: number, host: string, https: boolean, config: import('types/config').ValidatedConfig }} Options */ /** @typedef {import('types/internal').SSRComponent} SSRComponent */ @@ -30,7 +31,7 @@ class Watcher extends EventEmitter { super(); this.cwd = cwd; - this.dir = path.resolve(cwd, '.svelte/dev'); + this.dir = path.resolve(cwd, `${SVELTE_KIT}/dev`); this.port = port; this.host = host; @@ -162,7 +163,7 @@ class Watcher extends EventEmitter { amp: this.config.kit.amp, dev: true, entry: { - file: '/.svelte/dev/runtime/internal/start.js', + file: `/${SVELTE_KIT}/dev/runtime/internal/start.js`, css: [], js: [] }, diff --git a/packages/kit/src/core/start/index.js b/packages/kit/src/core/start/index.js index 1d112d472726..fe187cc51457 100644 --- a/packages/kit/src/core/start/index.js +++ b/packages/kit/src/core/start/index.js @@ -5,6 +5,7 @@ import { getRawBody } from '../http/index.js'; import { join, resolve } from 'path'; import { get_server } from '../server/index.js'; import '../../install-fetch.js'; +import { SVELTE_KIT } from '../constants.js'; /** @param {string} dir */ const mutable = (dir) => @@ -23,7 +24,7 @@ const mutable = (dir) => * }} opts */ export async function start({ port, host, config, https: use_https = false, cwd = process.cwd() }) { - const app_file = resolve(cwd, '.svelte/output/server/app.js'); + const app_file = resolve(cwd, `${SVELTE_KIT}/output/server/app.js`); /** @type {import('types/internal').App} */ const app = await import(pathToFileURL(app_file).href); @@ -33,7 +34,7 @@ export async function start({ port, host, config, https: use_https = false, cwd ? mutable(config.kit.files.assets) : (_req, _res, next) => next(); - const assets_handler = sirv(resolve(cwd, '.svelte/output/client'), { + const assets_handler = sirv(resolve(cwd, `${SVELTE_KIT}/output/client`), { maxAge: 31536000, immutable: true }); From d16b3dcc659576984d49f6d7414f90ffa17aa4fa Mon Sep 17 00:00:00 2001 From: Rich Harris Date: Mon, 3 May 2021 18:18:12 -0400 Subject: [PATCH 02/17] update gitignores in project templates --- packages/create-svelte/templates/default/.gitignore | 2 +- packages/create-svelte/templates/skeleton/.gitignore | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/packages/create-svelte/templates/default/.gitignore b/packages/create-svelte/templates/default/.gitignore index e7002107841e..0a4623184983 100644 --- a/packages/create-svelte/templates/default/.gitignore +++ b/packages/create-svelte/templates/default/.gitignore @@ -1,5 +1,5 @@ .DS_Store node_modules -/.svelte +/.svelte-kit /build /functions diff --git a/packages/create-svelte/templates/skeleton/.gitignore b/packages/create-svelte/templates/skeleton/.gitignore index e7002107841e..0a4623184983 100644 --- a/packages/create-svelte/templates/skeleton/.gitignore +++ b/packages/create-svelte/templates/skeleton/.gitignore @@ -1,5 +1,5 @@ .DS_Store node_modules -/.svelte +/.svelte-kit /build /functions From ed501e97f83a7c97393692b206704be1fc44d401 Mon Sep 17 00:00:00 2001 From: Rich Harris Date: Mon, 3 May 2021 18:24:01 -0400 Subject: [PATCH 03/17] changeset --- .changeset/flat-turtles-scream.md | 6 ++++++ 1 file changed, 6 insertions(+) create mode 100644 .changeset/flat-turtles-scream.md diff --git a/.changeset/flat-turtles-scream.md b/.changeset/flat-turtles-scream.md new file mode 100644 index 000000000000..d46d87d69d94 --- /dev/null +++ b/.changeset/flat-turtles-scream.md @@ -0,0 +1,6 @@ +--- +'create-svelte': patch +'@sveltejs/kit': patch +--- + +Rename .svelte to .svelte-kit From 31cef67c9df46fe376abfc13098d36a5dda4ffe8 Mon Sep 17 00:00:00 2001 From: Rich Harris Date: Mon, 3 May 2021 18:30:18 -0400 Subject: [PATCH 04/17] convert all config files to ESM --- .../+typescript/{svelte.config.cjs => svelte.config.js} | 6 ++++-- .../-typescript/{svelte.config.cjs => svelte.config.js} | 4 +++- .../default/{svelte.config.cjs => svelte.config.js} | 7 +++---- .../skeleton/{svelte.config.cjs => svelte.config.js} | 5 ++--- packages/kit/test/apps/amp/svelte.config.cjs | 5 ----- packages/kit/test/apps/amp/svelte.config.js | 8 ++++++++ .../apps/basics/{svelte.config.cjs => svelte.config.js} | 5 ++++- .../{svelte.config.cjs => svelte.config.js} | 5 ++++- packages/kit/test/apps/options/svelte.config.cjs | 5 ++++- 9 files changed, 32 insertions(+), 18 deletions(-) rename packages/create-svelte/shared/+typescript/{svelte.config.cjs => svelte.config.js} (76%) rename packages/create-svelte/shared/-typescript/{svelte.config.cjs => svelte.config.js} (77%) rename packages/create-svelte/templates/default/{svelte.config.cjs => svelte.config.js} (73%) rename packages/create-svelte/templates/skeleton/{svelte.config.cjs => svelte.config.js} (75%) delete mode 100644 packages/kit/test/apps/amp/svelte.config.cjs create mode 100644 packages/kit/test/apps/amp/svelte.config.js rename packages/kit/test/apps/basics/{svelte.config.cjs => svelte.config.js} (76%) rename packages/kit/test/apps/custom-extension/{svelte.config.cjs => svelte.config.js} (51%) diff --git a/packages/create-svelte/shared/+typescript/svelte.config.cjs b/packages/create-svelte/shared/+typescript/svelte.config.js similarity index 76% rename from packages/create-svelte/shared/+typescript/svelte.config.cjs rename to packages/create-svelte/shared/+typescript/svelte.config.js index 9133017977fe..5eb051a07d70 100644 --- a/packages/create-svelte/shared/+typescript/svelte.config.cjs +++ b/packages/create-svelte/shared/+typescript/svelte.config.js @@ -1,7 +1,7 @@ -const preprocess = require('svelte-preprocess'); +import preprocess from 'svelte-preprocess'; /** @type {import('@sveltejs/kit').Config} */ -module.exports = { +const config = { // Consult https://github.com/sveltejs/svelte-preprocess // for more information about preprocessors preprocess: preprocess(), @@ -11,3 +11,5 @@ module.exports = { target: '#svelte' } }; + +export default config; diff --git a/packages/create-svelte/shared/-typescript/svelte.config.cjs b/packages/create-svelte/shared/-typescript/svelte.config.js similarity index 77% rename from packages/create-svelte/shared/-typescript/svelte.config.cjs rename to packages/create-svelte/shared/-typescript/svelte.config.js index edb9c69ab38b..b879536152cc 100644 --- a/packages/create-svelte/shared/-typescript/svelte.config.cjs +++ b/packages/create-svelte/shared/-typescript/svelte.config.js @@ -1,7 +1,9 @@ /** @type {import('@sveltejs/kit').Config} */ -module.exports = { +const config = { kit: { // hydrate the
element in src/app.html target: '#svelte' } }; + +export default config; diff --git a/packages/create-svelte/templates/default/svelte.config.cjs b/packages/create-svelte/templates/default/svelte.config.js similarity index 73% rename from packages/create-svelte/templates/default/svelte.config.cjs rename to packages/create-svelte/templates/default/svelte.config.js index 375adf7c5a01..6cb2528d152c 100644 --- a/packages/create-svelte/templates/default/svelte.config.cjs +++ b/packages/create-svelte/templates/default/svelte.config.js @@ -1,5 +1,4 @@ -const sveltePreprocess = require('svelte-preprocess'); -const pkg = require('./package.json'); +import preprocess from 'svelte-preprocess'; const adapter = process.env.ADAPTER; const options = JSON.parse(process.env.OPTIONS || '{}'); @@ -8,7 +7,7 @@ const options = JSON.parse(process.env.OPTIONS || '{}'); const config = { // Consult https://github.com/sveltejs/svelte-preprocess // for more information about preprocessors - preprocess: sveltePreprocess(), + preprocess: preprocess(), kit: { // hydrate the
element in src/app.html @@ -20,4 +19,4 @@ if (adapter) { config.kit.adapter = require(adapter)(options); } -module.exports = config; +export default config; diff --git a/packages/create-svelte/templates/skeleton/svelte.config.cjs b/packages/create-svelte/templates/skeleton/svelte.config.js similarity index 75% rename from packages/create-svelte/templates/skeleton/svelte.config.cjs rename to packages/create-svelte/templates/skeleton/svelte.config.js index dac8a8b71a66..3406f45bac3f 100644 --- a/packages/create-svelte/templates/skeleton/svelte.config.cjs +++ b/packages/create-svelte/templates/skeleton/svelte.config.js @@ -1,5 +1,4 @@ -const node = require('@sveltejs/adapter-node'); -const pkg = require('./package.json'); +import node from '@sveltejs/adapter-node'; /** @type {import('@sveltejs/kit').Config} */ const config = { @@ -14,4 +13,4 @@ const config = { } }; -module.exports = config; +export default config; diff --git a/packages/kit/test/apps/amp/svelte.config.cjs b/packages/kit/test/apps/amp/svelte.config.cjs deleted file mode 100644 index 51eb2c8466ef..000000000000 --- a/packages/kit/test/apps/amp/svelte.config.cjs +++ /dev/null @@ -1,5 +0,0 @@ -module.exports = { - kit: { - amp: true - } -}; diff --git a/packages/kit/test/apps/amp/svelte.config.js b/packages/kit/test/apps/amp/svelte.config.js new file mode 100644 index 000000000000..5fe016e42d3d --- /dev/null +++ b/packages/kit/test/apps/amp/svelte.config.js @@ -0,0 +1,8 @@ +/** @type {import('@sveltejs/kit').Config} */ +const config = { + kit: { + amp: true + } +}; + +export default config; diff --git a/packages/kit/test/apps/basics/svelte.config.cjs b/packages/kit/test/apps/basics/svelte.config.js similarity index 76% rename from packages/kit/test/apps/basics/svelte.config.cjs rename to packages/kit/test/apps/basics/svelte.config.js index 594bd5a8bb07..32c11b217047 100644 --- a/packages/kit/test/apps/basics/svelte.config.cjs +++ b/packages/kit/test/apps/basics/svelte.config.js @@ -1,4 +1,5 @@ -module.exports = { +/** @type {import('@sveltejs/kit').Config} */ +const config = { kit: { hostHeader: 'x-forwarded-host', vite: { @@ -14,3 +15,5 @@ module.exports = { } } }; + +export default config; diff --git a/packages/kit/test/apps/custom-extension/svelte.config.cjs b/packages/kit/test/apps/custom-extension/svelte.config.js similarity index 51% rename from packages/kit/test/apps/custom-extension/svelte.config.cjs rename to packages/kit/test/apps/custom-extension/svelte.config.js index 890653d52119..02b844782a30 100644 --- a/packages/kit/test/apps/custom-extension/svelte.config.cjs +++ b/packages/kit/test/apps/custom-extension/svelte.config.js @@ -1,3 +1,6 @@ -module.exports = { +/** @type {import('@sveltejs/kit').Config} */ +const config = { extensions: ['.jesuslivesineveryone', '.whokilledthemuffinman', '.svelte.md', '.svelte'] }; + +export default config; diff --git a/packages/kit/test/apps/options/svelte.config.cjs b/packages/kit/test/apps/options/svelte.config.cjs index 29b77bb58b5e..f3e343724df6 100644 --- a/packages/kit/test/apps/options/svelte.config.cjs +++ b/packages/kit/test/apps/options/svelte.config.cjs @@ -1,4 +1,5 @@ -module.exports = { +/** @type {import('@sveltejs/kit').Config} */ +const config = { kit: { files: { assets: 'public', @@ -18,3 +19,5 @@ module.exports = { } } }; + +export default config; From 24e596671eafeac04269daebe59c9cb66941c400 Mon Sep 17 00:00:00 2001 From: Rich Harris Date: Mon, 3 May 2021 18:51:17 -0400 Subject: [PATCH 05/17] convert adapters to ESM --- .gitignore | 2 +- packages/adapter-begin/README.md | 6 +++--- packages/adapter-cloudflare-workers/index.js | 14 ++++++-------- packages/adapter-cloudflare-workers/package.json | 4 ++++ packages/adapter-netlify/README.md | 7 ++++--- packages/adapter-netlify/index.js | 12 ++++++------ packages/adapter-netlify/package.json | 4 ++++ packages/adapter-node/{index.cjs => index.js} | 8 ++++---- packages/adapter-node/package.json | 5 ++++- packages/adapter-static/README.md | 12 ++++++------ packages/adapter-static/{index.cjs => index.js} | 4 ++-- packages/adapter-static/package.json | 10 +++++----- .../test/apps/prerendered/svelte.config.cjs | 7 ------- .../test/apps/prerendered/svelte.config.js | 11 +++++++++++ .../spa/{svelte.config.cjs => svelte.config.js} | 8 ++++++-- packages/adapter-vercel/README.md | 4 ++-- packages/adapter-vercel/index.js | 10 +++++----- packages/adapter-vercel/package.json | 4 ++++ 18 files changed, 77 insertions(+), 55 deletions(-) rename packages/adapter-node/{index.cjs => index.js} (83%) rename packages/adapter-static/{index.cjs => index.js} (77%) delete mode 100644 packages/adapter-static/test/apps/prerendered/svelte.config.cjs create mode 100644 packages/adapter-static/test/apps/prerendered/svelte.config.js rename packages/adapter-static/test/apps/spa/{svelte.config.cjs => svelte.config.js} (51%) diff --git a/.gitignore b/.gitignore index 5f392d6c02e9..fefa41183277 100644 --- a/.gitignore +++ b/.gitignore @@ -9,6 +9,6 @@ yarn.lock .env .vercel_build_output .netlify -.svelte +.svelte-kit .cloudflare .pnpm-debug.log diff --git a/packages/adapter-begin/README.md b/packages/adapter-begin/README.md index 26996e27fc7a..2ba5f1919f44 100644 --- a/packages/adapter-begin/README.md +++ b/packages/adapter-begin/README.md @@ -6,12 +6,12 @@ Adapter for Svelte apps that creates a [Begin](https://begin.com/) app, using a Add `"@sveltejs/adapter-begin": "next"` to the `devDependencies` in your `package.json` and run `npm install`. -Then add the adapter to your `svelte.config.cjs`: +Then add the adapter to your `svelte.config.js`: ```js -const begin = require('@sveltejs/adapter-begin'); +import begin from '@sveltejs/adapter-begin'; -module.exports = { +export default { kit: { ... adapter: begin() diff --git a/packages/adapter-cloudflare-workers/index.js b/packages/adapter-cloudflare-workers/index.js index 42fbdb819864..fd925a2275a4 100644 --- a/packages/adapter-cloudflare-workers/index.js +++ b/packages/adapter-cloudflare-workers/index.js @@ -1,11 +1,9 @@ -'use strict'; +import fs from 'fs'; +import { execSync } from 'child_process'; +import esbuild from 'esbuild'; +import toml from 'toml'; -const fs = require('fs'); -const { execSync } = require('child_process'); -const esbuild = require('esbuild'); -const toml = require('toml'); - -module.exports = function () { +export default function () { /** @type {import('@sveltejs/kit').Adapter} */ const adapter = { name: '@sveltejs/adapter-cloudflare-workers', @@ -50,7 +48,7 @@ module.exports = function () { }; return adapter; -}; +} function validate_config(utils) { if (fs.existsSync('wrangler.toml')) { diff --git a/packages/adapter-cloudflare-workers/package.json b/packages/adapter-cloudflare-workers/package.json index cb0a08c4fefd..6cb5596fec24 100644 --- a/packages/adapter-cloudflare-workers/package.json +++ b/packages/adapter-cloudflare-workers/package.json @@ -1,6 +1,10 @@ { "name": "@sveltejs/adapter-cloudflare-workers", "version": "0.0.2-next.5", + "type": "module", + "exports": { + "import": "./index.js" + }, "main": "index.js", "types": "index.d.ts", "files": [ diff --git a/packages/adapter-netlify/README.md b/packages/adapter-netlify/README.md index 3bb21cda3483..7fea71cac2b8 100644 --- a/packages/adapter-netlify/README.md +++ b/packages/adapter-netlify/README.md @@ -12,11 +12,12 @@ This is very experimental; the adapter API isn't at all fleshed out, and things npm i -D @sveltejs/adapter-netlify@next ``` -You can then configure it inside of `svelte.config.cjs`: +You can then configure it inside of `svelte.config.js`: ```js -const adapter = require('@sveltejs/adapter-netlify'); -module.exports = { +import adapter from '@sveltejs/adapter-netlify'; + +export default { kit: { adapter: adapter(), // currently the adapter does not take any options target: '#svelte' diff --git a/packages/adapter-netlify/index.js b/packages/adapter-netlify/index.js index 547ec957b7b7..bdbcc8e89522 100644 --- a/packages/adapter-netlify/index.js +++ b/packages/adapter-netlify/index.js @@ -1,9 +1,9 @@ -const { existsSync, readFileSync, writeFileSync } = require('fs'); -const { join } = require('path'); -const esbuild = require('esbuild'); -const toml = require('toml'); +import { existsSync, readFileSync, writeFileSync } from 'fs'; +import { join } from 'path'; +import esbuild from 'esbuild'; +import toml from 'toml'; -module.exports = function () { +export default function () { /** @type {import('@sveltejs/kit').Adapter} */ const adapter = { name: '@sveltejs/adapter-netlify', @@ -43,7 +43,7 @@ module.exports = function () { }; return adapter; -}; +} function validate_config() { if (existsSync('netlify.toml')) { diff --git a/packages/adapter-netlify/package.json b/packages/adapter-netlify/package.json index 79b015f85f44..5479453ad32b 100644 --- a/packages/adapter-netlify/package.json +++ b/packages/adapter-netlify/package.json @@ -1,6 +1,10 @@ { "name": "@sveltejs/adapter-netlify", "version": "1.0.0-next.10", + "type": "module", + "exports": { + "import": "./index.js" + }, "main": "index.js", "types": "index.d.ts", "files": [ diff --git a/packages/adapter-node/index.cjs b/packages/adapter-node/index.js similarity index 83% rename from packages/adapter-node/index.cjs rename to packages/adapter-node/index.js index c2a3cef0147c..e78eb3422203 100644 --- a/packages/adapter-node/index.cjs +++ b/packages/adapter-node/index.js @@ -1,12 +1,12 @@ -const { copyFileSync } = require('fs'); -const { join } = require('path'); +import { copyFileSync } from 'fs'; +import { join } from 'path'; /** * @param {{ * out?: string; * }} options */ -module.exports = function ({ out = 'build' } = {}) { +export default function ({ out = 'build' } = {}) { /** @type {import('@sveltejs/kit').Adapter} */ const adapter = { name: '@sveltejs/adapter-node', @@ -30,4 +30,4 @@ module.exports = function ({ out = 'build' } = {}) { }; return adapter; -}; +} diff --git a/packages/adapter-node/package.json b/packages/adapter-node/package.json index adc6d97fd964..4b2f246bd787 100644 --- a/packages/adapter-node/package.json +++ b/packages/adapter-node/package.json @@ -1,8 +1,11 @@ { "name": "@sveltejs/adapter-node", "version": "1.0.0-next.17", - "main": "index.cjs", "type": "module", + "exports": { + "import": "./index.js" + }, + "main": "index.js", "types": "index.d.ts", "files": [ "files", diff --git a/packages/adapter-static/README.md b/packages/adapter-static/README.md index b8c64ae0f404..7b5a285a5925 100644 --- a/packages/adapter-static/README.md +++ b/packages/adapter-static/README.md @@ -3,10 +3,10 @@ [Adapter](https://kit.svelte.dev/docs#adapters) for SvelteKit apps that prerenders your site as a collection of static files. ```js -// svelte.config.cjs -const adapter = require('@sveltejs/adapter-static'); +// svelte.config.js +import adapter from '@sveltejs/adapter-static'; -module.exports = { +export default { kit: { adapter: adapter({ // default options are shown @@ -43,10 +43,10 @@ You can use `adapter-static` to create a single-page app or SPA by specifying a The fallback page is a blank HTML page that loads your SvelteKit app and navigates to the correct route. For example [Surge](https://surge.sh/help/adding-a-200-page-for-client-side-routing), a static web host, lets you add a `200.html` file that will handle any requests that don't otherwise match. We can create that file like so: ```js -// svelte.config.cjs -const adapter = require('@sveltejs/adapter-static'); +// svelte.config.js +import adapter from '@sveltejs/adapter-static'; -module.exports = { +export default { kit: { adapter: adapter({ fallback: '200.html' diff --git a/packages/adapter-static/index.cjs b/packages/adapter-static/index.js similarity index 77% rename from packages/adapter-static/index.cjs rename to packages/adapter-static/index.js index 17ca222dc919..0346634ba80e 100644 --- a/packages/adapter-static/index.cjs +++ b/packages/adapter-static/index.js @@ -1,4 +1,4 @@ -module.exports = function ({ pages = 'build', assets = pages, fallback = null } = {}) { +export default function ({ pages = 'build', assets = pages, fallback = null } = {}) { /** @type {import('@sveltejs/kit').Adapter} */ const adapter = { name: '@sveltejs/adapter-static', @@ -16,4 +16,4 @@ module.exports = function ({ pages = 'build', assets = pages, fallback = null } }; return adapter; -}; +} diff --git a/packages/adapter-static/package.json b/packages/adapter-static/package.json index 082baca8675a..7ceacdf5434d 100644 --- a/packages/adapter-static/package.json +++ b/packages/adapter-static/package.json @@ -1,6 +1,11 @@ { "name": "@sveltejs/adapter-static", "version": "1.0.0-next.7", + "type": "module", + "main": "index.js", + "exports": { + "import": "./index.cjs" + }, "types": "index.d.ts", "scripts": { "lint": "eslint --ignore-path .gitignore \"**/*.{ts,js,svelte}\" && npm run check-format", @@ -15,10 +20,5 @@ "port-authority": "^1.1.2", "sirv": "^1.0.11", "typescript": "^4.2.4" - }, - "type": "module", - "main": "index.cjs", - "exports": { - "require": "./index.cjs" } } diff --git a/packages/adapter-static/test/apps/prerendered/svelte.config.cjs b/packages/adapter-static/test/apps/prerendered/svelte.config.cjs deleted file mode 100644 index 40f26e69fd62..000000000000 --- a/packages/adapter-static/test/apps/prerendered/svelte.config.cjs +++ /dev/null @@ -1,7 +0,0 @@ -/** @type {import('@sveltejs/kit').Config} */ -module.exports = { - kit: { - adapter: require('../../../index.cjs')(), - target: '#svelte' - } -}; diff --git a/packages/adapter-static/test/apps/prerendered/svelte.config.js b/packages/adapter-static/test/apps/prerendered/svelte.config.js new file mode 100644 index 000000000000..bdf36d80ed0b --- /dev/null +++ b/packages/adapter-static/test/apps/prerendered/svelte.config.js @@ -0,0 +1,11 @@ +import adapter from '../../../index.js'; + +/** @type {import('@sveltejs/kit').Config} */ +const config = { + kit: { + adapter: adapter(), + target: '#svelte' + } +}; + +export default config; diff --git a/packages/adapter-static/test/apps/spa/svelte.config.cjs b/packages/adapter-static/test/apps/spa/svelte.config.js similarity index 51% rename from packages/adapter-static/test/apps/spa/svelte.config.cjs rename to packages/adapter-static/test/apps/spa/svelte.config.js index fdd98ce5120a..6cc713a25f9a 100644 --- a/packages/adapter-static/test/apps/spa/svelte.config.cjs +++ b/packages/adapter-static/test/apps/spa/svelte.config.js @@ -1,9 +1,13 @@ +import adapter from '../../../index.js'; + /** @type {import('@sveltejs/kit').Config} */ -module.exports = { +const config = { kit: { - adapter: require('../../../index.cjs')({ + adapter: adapter({ fallback: '200.html' }), target: '#svelte' } }; + +export default config; diff --git a/packages/adapter-vercel/README.md b/packages/adapter-vercel/README.md index 60b0c49da826..fb66a193ceb7 100644 --- a/packages/adapter-vercel/README.md +++ b/packages/adapter-vercel/README.md @@ -9,9 +9,9 @@ Add `"@sveltejs/adapter-vercel": "next"` to the `devDependencies` in your `packa Then in your `svelte.config.js`: ```js -const vercel = require('@sveltejs/adapter-vercel'); +import vercel from '@sveltejs/adapter-vercel'; -module.exports = { +export default { kit: { ... adapter: vercel() diff --git a/packages/adapter-vercel/index.js b/packages/adapter-vercel/index.js index e5e5380c2fc8..9b779a16da31 100644 --- a/packages/adapter-vercel/index.js +++ b/packages/adapter-vercel/index.js @@ -1,8 +1,8 @@ -const { writeFileSync } = require('fs'); -const { join } = require('path'); -const esbuild = require('esbuild'); +import { writeFileSync } from 'fs'; +import { join } from 'path'; +import esbuild from 'esbuild'; -module.exports = function () { +export default function () { /** @type {import('@sveltejs/kit').Adapter} */ const adapter = { name: '@sveltejs/adapter-vercel', @@ -50,4 +50,4 @@ module.exports = function () { }; return adapter; -}; +} diff --git a/packages/adapter-vercel/package.json b/packages/adapter-vercel/package.json index 16fa29d64959..7b040a4edb18 100644 --- a/packages/adapter-vercel/package.json +++ b/packages/adapter-vercel/package.json @@ -1,6 +1,10 @@ { "name": "@sveltejs/adapter-vercel", "version": "1.0.0-next.15", + "type": "module", + "exports": { + "import": "./index.js" + }, "main": "index.js", "types": "index.d.ts", "files": [ From b982c05e8102851a3ab484421864b43a9e4ca084 Mon Sep 17 00:00:00 2001 From: Rich Harris Date: Mon, 3 May 2021 18:51:37 -0400 Subject: [PATCH 06/17] rename file --- .../kit/test/apps/options/{svelte.config.cjs => svelte.config.js} | 0 1 file changed, 0 insertions(+), 0 deletions(-) rename packages/kit/test/apps/options/{svelte.config.cjs => svelte.config.js} (100%) diff --git a/packages/kit/test/apps/options/svelte.config.cjs b/packages/kit/test/apps/options/svelte.config.js similarity index 100% rename from packages/kit/test/apps/options/svelte.config.cjs rename to packages/kit/test/apps/options/svelte.config.js From 0010dd1745b675d5e1ee69064fecfc509dd5402d Mon Sep 17 00:00:00 2001 From: Rich Harris Date: Mon, 3 May 2021 18:53:28 -0400 Subject: [PATCH 07/17] replace outdated warning with suggestion to convert svelte.config.cjs to ESM --- packages/kit/src/cli.js | 10 ++++++---- 1 file changed, 6 insertions(+), 4 deletions(-) diff --git a/packages/kit/src/cli.js b/packages/kit/src/cli.js index 705534385e91..97b44bac0836 100644 --- a/packages/kit/src/cli.js +++ b/packages/kit/src/cli.js @@ -7,15 +7,17 @@ import { networkInterfaces, release } from 'os'; async function get_config() { // TODO this is temporary, for the benefit of early adopters - if (existsSync('snowpack.config.js') || existsSync('snowpack.config.cjs')) { + if (existsSync('svelte.config.cjs')) { // prettier-ignore console.error(colors.bold().red( - 'SvelteKit now uses https://vitejs.dev. Please remove snowpack.config.js and put Vite config in svelte.config.cjs: https://kit.svelte.dev/docs#configuration-vite' + 'svelte.config.cjs should be renamed to svelte.config.js and converted to an ES module. See https://kit.svelte.dev/docs#configuration for an example' )); - } else if (existsSync('vite.config.js')) { + } + + if (existsSync('vite.config.js')) { // prettier-ignore console.error(colors.bold().red( - 'Please remove vite.config.js and put Vite config in svelte.config.cjs: https://kit.svelte.dev/docs#configuration-vite' + 'Please remove vite.config.js and put Vite config in svelte.config.js: https://kit.svelte.dev/docs#configuration-vite' )); } From ccd1e16eccecd4050dd3c19f3a23a22a8aa377d8 Mon Sep 17 00:00:00 2001 From: Rich Harris Date: Mon, 3 May 2021 18:53:33 -0400 Subject: [PATCH 08/17] update docs --- documentation/docs/10-adapters.md | 12 ++++++------ documentation/docs/13-configuration.md | 10 ++++++---- documentation/faq/50-aliases.md | 13 ++++++------- documentation/faq/70-packages.md | 4 ++-- documentation/faq/80-integrations.md | 2 +- documentation/migrating/03-project-files.md | 2 +- 6 files changed, 22 insertions(+), 21 deletions(-) diff --git a/documentation/docs/10-adapters.md b/documentation/docs/10-adapters.md index 8eee9d545f9f..6029b8e4db8f 100644 --- a/documentation/docs/10-adapters.md +++ b/documentation/docs/10-adapters.md @@ -7,10 +7,10 @@ Before you can deploy your SvelteKit app, you need to _adapt_ it for your deploy For example, if you want to run your app as a simple Node server, you would use the `@sveltejs/adapter-node` package: ```js -// svelte.config.cjs -const node = require('@sveltejs/adapter-node'); +// svelte.config.js +import node from '@sveltejs/adapter-node'; -module.exports = { +export default { kit: { adapter: node() } @@ -20,10 +20,10 @@ module.exports = { With this, [svelte-kit build](#command-line-interface-svelte-kit-build) will generate a self-contained Node app inside `build`. You can pass options to adapters, such as customising the output directory in `adapter-node`: ```diff -// svelte.config.cjs -const node = require('@sveltejs/adapter-node'); +// svelte.config.js +import node from '@sveltejs/adapter-node'; -module.exports = { +export default { kit: { - adapter: node() + adapter: node({ out: 'my-output-directory' }) diff --git a/documentation/docs/13-configuration.md b/documentation/docs/13-configuration.md index d126902e5f5c..e45edbeec77a 100644 --- a/documentation/docs/13-configuration.md +++ b/documentation/docs/13-configuration.md @@ -2,11 +2,11 @@ title: Configuration --- -Your project's configuration lives in a `svelte.config.cjs` file. All values are optional. The complete list of options, with defaults, is shown here: +Your project's configuration lives in a `svelte.config.js` file. All values are optional. The complete list of options, with defaults, is shown here: ```js /** @type {import('@sveltejs/kit').Config} */ -module.exports = { +const config = { // options passed to svelte.compile (https://svelte.dev/docs#svelte_compile) compilerOptions: null, @@ -48,6 +48,8 @@ module.exports = { // options passed to svelte.preprocess (https://svelte.dev/docs#svelte_preprocess) preprocess: null }; + +export default config; ``` ### adapter @@ -94,8 +96,8 @@ A value that overrides the `Host` header when populating `page.host` If your app is behind a reverse proxy (think load balancers and CDNs) then the `Host` header will be incorrect. In most cases, the underlying host is exposed via the [`X-Forwarded-Host`](https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/X-Forwarded-Host) header and you should specify this in your config if you need to access `page.host`: ```js -// svelte.config.cjs -module.exports = { +// svelte.config.js +export default { kit: { hostHeader: 'X-Forwarded-Host' } diff --git a/documentation/faq/50-aliases.md b/documentation/faq/50-aliases.md index 6a864115f4ea..390297c11ec2 100644 --- a/documentation/faq/50-aliases.md +++ b/documentation/faq/50-aliases.md @@ -2,14 +2,13 @@ question: How do I setup a path alias? --- -Please be aware that you will probably want the alias specified in two places. - -In `svelte.config.cjs` add [`vite.resolve.alias`](https://vitejs.dev/config/#resolve-alias): +First, you need to add it to the Vite configuration. In `svelte.config.js` add [`vite.resolve.alias`](https://vitejs.dev/config/#resolve-alias): ```js -// svelte.config.cjs -const path = require('path'); -module.exports = { +// svelte.config.js +import path from 'path'; + +export default { kit: { vite: { resolve: { @@ -22,7 +21,7 @@ module.exports = { }; ``` -In `tsconfig.json` (for TypeScript users) or `jsconfig.json` (for JavaScript users) to make VS Code aware of the alias: +Then, to make TypeScript aware of the alias, add it to `tsconfig.json` (for TypeScript users) or `jsconfig.json`: ```js { diff --git a/documentation/faq/70-packages.md b/documentation/faq/70-packages.md index 293f4b6b6583..1f1c25f1ad7a 100644 --- a/documentation/faq/70-packages.md +++ b/documentation/faq/70-packages.md @@ -2,8 +2,8 @@ question: How do I fix the error I'm getting trying to include a package? --- -Old beta versions of the SvelteKit template included the configuration value `noExternal: Object.keys(pkg.dependencies || {})` in `svelte.config.cjs`. First, please check if this line is present in your project and remove it if so. Removing this line fixes most issues and has since been removed from the template. +Old beta versions of the SvelteKit template included the configuration value `noExternal: Object.keys(pkg.dependencies || {})` in `svelte.config.js`. First, please check if this line is present in your project and remove it if so. Removing this line fixes most issues and has since been removed from the template. -The second most commonly-encountered issue is having a Svelte component that imports a CommonJS library. In this case, you should try to work with the library authors to distribute an ESM version of the dependency. However, in the meantime, you can workaround this issue by adding the dependency to `vite.optimizeDeps.include` in `svelte.config.cjs`. +The second most commonly-encountered issue is having a Svelte component that imports a CommonJS library. In this case, you should try to work with the library authors to distribute an ESM version of the dependency. However, in the meantime, you can workaround this issue by adding the dependency to `vite.optimizeDeps.include` in `svelte.config.js`. Finally, Vite has had some issues that have been fixed, so we recommend upgrading to the latest version of Vite. If you are still encountering issues we recommend searching both [the Vite issue tracker](https://github.com/vitejs/vite/issues) and the issue tracker of the library in question. Sometimes issues can be worked around by fiddling with the [`optimizeDeps`](https://vitejs.dev/config/#dep-optimization-options) or [`ssr`](https://vitejs.dev/config/#ssr-options) config values. diff --git a/documentation/faq/80-integrations.md b/documentation/faq/80-integrations.md index 123d99389221..bf158da126d3 100644 --- a/documentation/faq/80-integrations.md +++ b/documentation/faq/80-integrations.md @@ -8,7 +8,7 @@ Please see [sveltejs/integrations](https://github.com/sveltejs/integrations#svel ### How do I use `svelte-preprocess`? -`svelte-preprocess` provides support for Babel, CoffeeScript, Less, PostCSS / SugarSS, Pug, scss/sass, Stylus, TypeScript, `global` styles, and replace. Adding [svelte-preprocess](https://github.com/sveltejs/svelte-preprocess) to your [`svelte.config.cjs`](#configuration) is the first step. It is provided by the template if you're using TypeScript. JavaScript users will need to add it. For many of the tools listed above, you will then only need to install the corresponding library such as `npm install -D sass`or `npm install -D less`. See the [svelte-preprocess](https://github.com/sveltejs/svelte-preprocess) docs for full details. +`svelte-preprocess` provides support for Babel, CoffeeScript, Less, PostCSS / SugarSS, Pug, scss/sass, Stylus, TypeScript, `global` styles, and replace. Adding [svelte-preprocess](https://github.com/sveltejs/svelte-preprocess) to your [`svelte.config.js`](#configuration) is the first step. It is provided by the template if you're using TypeScript. JavaScript users will need to add it. For many of the tools listed above, you will then only need to install the corresponding library such as `npm install -D sass`or `npm install -D less`. See the [svelte-preprocess](https://github.com/sveltejs/svelte-preprocess) docs for full details. Also see [sveltejs/integrations](https://github.com/sveltejs/integrations#sveltekit) for examples of setting up these and similar libraries. diff --git a/documentation/migrating/03-project-files.md b/documentation/migrating/03-project-files.md index 9df3d50ef357..5a966898edc2 100644 --- a/documentation/migrating/03-project-files.md +++ b/documentation/migrating/03-project-files.md @@ -6,7 +6,7 @@ The bulk of your app, in `src/routes`, can be left where it is, but several proj ### Configuration -Your `webpack.config.js` or `rollup.config.js` should be replaced with a `svelte.config.cjs`, as documented [here](/docs#configuration). Svelte preprocessor options should be moved to `config.preprocess`. +Your `webpack.config.js` or `rollup.config.js` should be replaced with a `svelte.config.js`, as documented [here](/docs#configuration). Svelte preprocessor options should be moved to `config.preprocess`. You will need to add an [adapter](/docs#adapters). `sapper build` is roughly equivalent to [adapter-node](https://github.com/sveltejs/kit/tree/master/packages/adapter-node) while `sapper export` is roughly equivalent to [adapter-static](https://github.com/sveltejs/kit/tree/master/packages/adapter-static), though you might prefer to use an adapter designed for the platform you're deploying to. From e5b3a4dec17bb0cfb8aaa6ee20dcf9fc1c56d151 Mon Sep 17 00:00:00 2001 From: Rich Harris Date: Mon, 3 May 2021 18:54:19 -0400 Subject: [PATCH 09/17] changesets --- .changeset/thin-trains-own.md | 10 ++++++++++ .changeset/wise-bugs-run.md | 6 ++++++ 2 files changed, 16 insertions(+) create mode 100644 .changeset/thin-trains-own.md create mode 100644 .changeset/wise-bugs-run.md diff --git a/.changeset/thin-trains-own.md b/.changeset/thin-trains-own.md new file mode 100644 index 000000000000..72597fa35b76 --- /dev/null +++ b/.changeset/thin-trains-own.md @@ -0,0 +1,10 @@ +--- +'@sveltejs/adapter-begin': patch +'@sveltejs/adapter-cloudflare-workers': patch +'@sveltejs/adapter-netlify': patch +'@sveltejs/adapter-node': patch +'@sveltejs/adapter-static': patch +'@sveltejs/adapter-vercel': patch +--- + +Convert to ESM diff --git a/.changeset/wise-bugs-run.md b/.changeset/wise-bugs-run.md new file mode 100644 index 000000000000..34a70d3170aa --- /dev/null +++ b/.changeset/wise-bugs-run.md @@ -0,0 +1,6 @@ +--- +'create-svelte': patch +'@sveltejs/kit': patch +--- + +Switch to ESM in config files From 12dc54ce10ea7629b39db97e435b3bfd4a27c1ac Mon Sep 17 00:00:00 2001 From: Rich Harris Date: Mon, 3 May 2021 19:01:04 -0400 Subject: [PATCH 10/17] fix type --- packages/kit/types/config.d.ts | 1 + 1 file changed, 1 insertion(+) diff --git a/packages/kit/types/config.d.ts b/packages/kit/types/config.d.ts index daa8c131614c..662be69770e5 100644 --- a/packages/kit/types/config.d.ts +++ b/packages/kit/types/config.d.ts @@ -40,6 +40,7 @@ export type Config = { serviceWorker?: string; template?: string; }; + floc?: boolean; host?: string; hostHeader?: string; hydrate?: boolean; From 467a7b4532a5c7240554d73170aae960368e8261 Mon Sep 17 00:00:00 2001 From: Rich Harris Date: Mon, 3 May 2021 19:05:20 -0400 Subject: [PATCH 11/17] fix example --- examples/hn.svelte.dev/{svelte.config.cjs => svelte.config.js} | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) rename examples/hn.svelte.dev/{svelte.config.cjs => svelte.config.js} (58%) diff --git a/examples/hn.svelte.dev/svelte.config.cjs b/examples/hn.svelte.dev/svelte.config.js similarity index 58% rename from examples/hn.svelte.dev/svelte.config.cjs rename to examples/hn.svelte.dev/svelte.config.js index 68c8751e3db4..a68bdcaa45c7 100644 --- a/examples/hn.svelte.dev/svelte.config.cjs +++ b/examples/hn.svelte.dev/svelte.config.js @@ -1,4 +1,4 @@ -const netlify = require('@sveltejs/adapter-netlify'); +import netlify from '@sveltejs/adapter-netlify'; module.exports = { kit: { From 8a46da14120ed4ed47ff9ebf8a7ad6d3e5de8725 Mon Sep 17 00:00:00 2001 From: Rich Harris Date: Mon, 3 May 2021 19:09:01 -0400 Subject: [PATCH 12/17] doh --- examples/hn.svelte.dev/svelte.config.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/examples/hn.svelte.dev/svelte.config.js b/examples/hn.svelte.dev/svelte.config.js index a68bdcaa45c7..35c263652b6d 100644 --- a/examples/hn.svelte.dev/svelte.config.js +++ b/examples/hn.svelte.dev/svelte.config.js @@ -1,6 +1,6 @@ import netlify from '@sveltejs/adapter-netlify'; -module.exports = { +export default { kit: { adapter: netlify(), target: '#svelte' From fa59f1a72f9d4853412d4189ba91abdcdb162953 Mon Sep 17 00:00:00 2001 From: Rich Harris Date: Mon, 3 May 2021 19:18:05 -0400 Subject: [PATCH 13/17] missed a few --- packages/adapter-cloudflare-workers/index.js | 8 ++++---- packages/adapter-netlify/index.js | 4 ++-- packages/adapter-static/.gitignore | 4 ++-- packages/adapter-static/test/apps/prerendered/.gitignore | 2 +- packages/adapter-static/test/apps/spa/.gitignore | 2 +- packages/adapter-vercel/index.js | 6 +++--- 6 files changed, 13 insertions(+), 13 deletions(-) diff --git a/packages/adapter-cloudflare-workers/index.js b/packages/adapter-cloudflare-workers/index.js index 42fbdb819864..308e015f0ac5 100644 --- a/packages/adapter-cloudflare-workers/index.js +++ b/packages/adapter-cloudflare-workers/index.js @@ -19,17 +19,17 @@ module.exports = function () { utils.rimraf(entrypoint); utils.log.info('Installing worker dependencies...'); - utils.copy(`${__dirname}/files/_package.json`, '.svelte/cloudflare-workers/package.json'); + utils.copy(`${__dirname}/files/_package.json`, '.svelte-kit/cloudflare-workers/package.json'); // TODO would be cool if we could make this step unnecessary somehow - const stdout = execSync('npm install', { cwd: '.svelte/cloudflare-workers' }); + const stdout = execSync('npm install', { cwd: '.svelte-kit/cloudflare-workers' }); utils.log.info(stdout.toString()); utils.log.minor('Generating worker...'); - utils.copy(`${__dirname}/files/entry.js`, '.svelte/cloudflare-workers/entry.js'); + utils.copy(`${__dirname}/files/entry.js`, '.svelte-kit/cloudflare-workers/entry.js'); await esbuild.build({ - entryPoints: ['.svelte/cloudflare-workers/entry.js'], + entryPoints: ['.svelte-kit/cloudflare-workers/entry.js'], outfile: `${entrypoint}/index.js`, bundle: true, target: 'es2020', diff --git a/packages/adapter-netlify/index.js b/packages/adapter-netlify/index.js index 547ec957b7b7..d3962aa5525f 100644 --- a/packages/adapter-netlify/index.js +++ b/packages/adapter-netlify/index.js @@ -17,10 +17,10 @@ module.exports = function () { const files = join(__dirname, 'files'); utils.log.minor('Generating serverless function...'); - utils.copy(join(files, 'entry.js'), '.svelte/netlify/entry.js'); + utils.copy(join(files, 'entry.js'), '.svelte-kit/netlify/entry.js'); await esbuild.build({ - entryPoints: ['.svelte/netlify/entry.js'], + entryPoints: ['.svelte-kit/netlify/entry.js'], outfile: join(functions, 'render/index.js'), bundle: true, platform: 'node' diff --git a/packages/adapter-static/.gitignore b/packages/adapter-static/.gitignore index 0e04bb264232..0deea236f592 100644 --- a/packages/adapter-static/.gitignore +++ b/packages/adapter-static/.gitignore @@ -1,4 +1,4 @@ .DS_Store node_modules -.svelte -build \ No newline at end of file +.svelte-kit +build diff --git a/packages/adapter-static/test/apps/prerendered/.gitignore b/packages/adapter-static/test/apps/prerendered/.gitignore index e7002107841e..0a4623184983 100644 --- a/packages/adapter-static/test/apps/prerendered/.gitignore +++ b/packages/adapter-static/test/apps/prerendered/.gitignore @@ -1,5 +1,5 @@ .DS_Store node_modules -/.svelte +/.svelte-kit /build /functions diff --git a/packages/adapter-static/test/apps/spa/.gitignore b/packages/adapter-static/test/apps/spa/.gitignore index e7002107841e..0a4623184983 100644 --- a/packages/adapter-static/test/apps/spa/.gitignore +++ b/packages/adapter-static/test/apps/spa/.gitignore @@ -1,5 +1,5 @@ .DS_Store node_modules -/.svelte +/.svelte-kit /build /functions diff --git a/packages/adapter-vercel/index.js b/packages/adapter-vercel/index.js index e5e5380c2fc8..59b8b9d6b9ca 100644 --- a/packages/adapter-vercel/index.js +++ b/packages/adapter-vercel/index.js @@ -19,15 +19,15 @@ module.exports = function () { }; // TODO ideally we'd have something like utils.tmpdir('vercel') - // rather than hardcoding '.svelte/vercel/entry.js', and the + // rather than hardcoding '.svelte-kit/vercel/entry.js', and the // relative import from that file to output/server/app.js // would be controlled. at the moment we're exposing // implementation details that could change utils.log.minor('Generating serverless function...'); - utils.copy(join(files, 'entry.js'), '.svelte/vercel/entry.js'); + utils.copy(join(files, 'entry.js'), '.svelte-kit/vercel/entry.js'); await esbuild.build({ - entryPoints: ['.svelte/vercel/entry.js'], + entryPoints: ['.svelte-kit/vercel/entry.js'], outfile: join(dirs.lambda, 'index.js'), bundle: true, platform: 'node' From 7cf04f3a3aaa051e6c367e7ec0ce92b5b34e3cdd Mon Sep 17 00:00:00 2001 From: Rich Harris Date: Mon, 3 May 2021 20:37:37 -0400 Subject: [PATCH 14/17] remove __dirname --- packages/adapter-cloudflare-workers/index.js | 7 +++++-- packages/adapter-netlify/index.js | 3 ++- packages/adapter-node/index.js | 4 +++- packages/adapter-vercel/index.js | 3 ++- 4 files changed, 12 insertions(+), 5 deletions(-) diff --git a/packages/adapter-cloudflare-workers/index.js b/packages/adapter-cloudflare-workers/index.js index 9cd0c721fac1..7fe50ad5f57c 100644 --- a/packages/adapter-cloudflare-workers/index.js +++ b/packages/adapter-cloudflare-workers/index.js @@ -2,6 +2,7 @@ import fs from 'fs'; import { execSync } from 'child_process'; import esbuild from 'esbuild'; import toml from 'toml'; +import { fileURLToPath } from 'url'; export default function () { /** @type {import('@sveltejs/kit').Adapter} */ @@ -13,18 +14,20 @@ export default function () { const bucket = site.bucket; const entrypoint = site['entry-point'] || 'workers-site'; + const files = fileURLToPath(new URL('./files', import.meta.url)); + utils.rimraf(bucket); utils.rimraf(entrypoint); utils.log.info('Installing worker dependencies...'); - utils.copy(`${__dirname}/files/_package.json`, '.svelte-kit/cloudflare-workers/package.json'); + utils.copy(`${files}/_package.json`, '.svelte-kit/cloudflare-workers/package.json'); // TODO would be cool if we could make this step unnecessary somehow const stdout = execSync('npm install', { cwd: '.svelte-kit/cloudflare-workers' }); utils.log.info(stdout.toString()); utils.log.minor('Generating worker...'); - utils.copy(`${__dirname}/files/entry.js`, '.svelte-kit/cloudflare-workers/entry.js'); + utils.copy(`${files}/entry.js`, '.svelte-kit/cloudflare-workers/entry.js'); await esbuild.build({ entryPoints: ['.svelte-kit/cloudflare-workers/entry.js'], diff --git a/packages/adapter-netlify/index.js b/packages/adapter-netlify/index.js index ebe98595268f..5954270b449b 100644 --- a/packages/adapter-netlify/index.js +++ b/packages/adapter-netlify/index.js @@ -1,5 +1,6 @@ import { existsSync, readFileSync, writeFileSync } from 'fs'; import { join } from 'path'; +import { fileURLToPath } from 'url'; import esbuild from 'esbuild'; import toml from 'toml'; @@ -14,7 +15,7 @@ export default function () { utils.rimraf(publish); utils.rimraf(functions); - const files = join(__dirname, 'files'); + const files = fileURLToPath(new URL('./files', import.meta.url)); utils.log.minor('Generating serverless function...'); utils.copy(join(files, 'entry.js'), '.svelte-kit/netlify/entry.js'); diff --git a/packages/adapter-node/index.js b/packages/adapter-node/index.js index e78eb3422203..238b29133bc4 100644 --- a/packages/adapter-node/index.js +++ b/packages/adapter-node/index.js @@ -1,5 +1,6 @@ import { copyFileSync } from 'fs'; import { join } from 'path'; +import { fileURLToPath } from 'url'; /** * @param {{ @@ -20,7 +21,8 @@ export default function ({ out = 'build' } = {}) { utils.log.minor('Copying server'); utils.copy_server_files(out); - copyFileSync(`${__dirname}/files/server.js`, `${out}/index.js`); + const files = fileURLToPath(new URL('./files', import.meta.url)); + copyFileSync(`${files}/server.js`, `${out}/index.js`); utils.log.minor('Prerendering static pages'); await utils.prerender({ diff --git a/packages/adapter-vercel/index.js b/packages/adapter-vercel/index.js index 6e50118ad61d..10bd4e63b1ad 100644 --- a/packages/adapter-vercel/index.js +++ b/packages/adapter-vercel/index.js @@ -1,5 +1,6 @@ import { writeFileSync } from 'fs'; import { join } from 'path'; +import { fileURLToPath } from 'url'; import esbuild from 'esbuild'; export default function () { @@ -11,7 +12,7 @@ export default function () { const dir = '.vercel_build_output'; utils.rimraf(dir); - const files = join(__dirname, 'files'); + const files = fileURLToPath(new URL('./files', import.meta.url)); const dirs = { static: join(dir, 'static'), From 7417794c95065a441e03e5e05ef1ec0cb94ccffc Mon Sep 17 00:00:00 2001 From: Rich Harris Date: Tue, 4 May 2021 09:44:22 -0400 Subject: [PATCH 15/17] bit of tidying up --- packages/adapter-node/tsconfig.json | 2 +- packages/adapter-static/package.json | 2 +- packages/adapter-static/tsconfig.json | 2 +- packages/adapter-vercel/rollup.config.js | 23 ----------------------- 4 files changed, 3 insertions(+), 26 deletions(-) delete mode 100644 packages/adapter-vercel/rollup.config.js diff --git a/packages/adapter-node/tsconfig.json b/packages/adapter-node/tsconfig.json index 79ee3a6fb47a..517604c951ec 100644 --- a/packages/adapter-node/tsconfig.json +++ b/packages/adapter-node/tsconfig.json @@ -9,5 +9,5 @@ "moduleResolution": "node", "allowSyntheticDefaultImports": true }, - "include": ["index.cjs", "src"] + "include": ["index.js", "src"] } diff --git a/packages/adapter-static/package.json b/packages/adapter-static/package.json index 7ceacdf5434d..10b1bf9c5aba 100644 --- a/packages/adapter-static/package.json +++ b/packages/adapter-static/package.json @@ -4,7 +4,7 @@ "type": "module", "main": "index.js", "exports": { - "import": "./index.cjs" + "import": "./index.js" }, "types": "index.d.ts", "scripts": { diff --git a/packages/adapter-static/tsconfig.json b/packages/adapter-static/tsconfig.json index 5e88bbd94a98..113d5b4c70e3 100644 --- a/packages/adapter-static/tsconfig.json +++ b/packages/adapter-static/tsconfig.json @@ -10,5 +10,5 @@ "allowSyntheticDefaultImports": true, "skipLibCheck": true }, - "include": ["index.cjs", "test/*.js"] + "include": ["index.js", "test/*.js"] } diff --git a/packages/adapter-vercel/rollup.config.js b/packages/adapter-vercel/rollup.config.js deleted file mode 100644 index 656e98946125..000000000000 --- a/packages/adapter-vercel/rollup.config.js +++ /dev/null @@ -1,23 +0,0 @@ -import { nodeResolve } from '@rollup/plugin-node-resolve'; -import commonjs from '@rollup/plugin-commonjs'; - -export default [ - { - input: 'src/entry.js', - output: { - file: 'files/entry.mjs', - format: 'es', - sourcemap: true, - exports: 'default' - }, - plugins: [nodeResolve(), commonjs()], - external: [...require('module').builtinModules, './server/app.mjs'] - }, - { - input: 'src/index.cjs', - output: { - file: 'files/index.js' - }, - external: './entry.mjs' - } -]; From 558b1cd374ab4caab2d64ec72d352398afc52f6e Mon Sep 17 00:00:00 2001 From: Rich Harris Date: Tue, 4 May 2021 09:47:55 -0400 Subject: [PATCH 16/17] add types --- packages/adapter-static/index.js | 7 +++++++ 1 file changed, 7 insertions(+) diff --git a/packages/adapter-static/index.js b/packages/adapter-static/index.js index 0346634ba80e..6546a923f976 100644 --- a/packages/adapter-static/index.js +++ b/packages/adapter-static/index.js @@ -1,3 +1,10 @@ +/** + * @param {{ + * pages?: string; + * assets?: string; + * fallback?: string; + * }} [opts] + */ export default function ({ pages = 'build', assets = pages, fallback = null } = {}) { /** @type {import('@sveltejs/kit').Adapter} */ const adapter = { From 25bfca23c6642bd7108ce99ddf63e0b56a573e28 Mon Sep 17 00:00:00 2001 From: Rich Harris Date: Tue, 4 May 2021 10:05:41 -0400 Subject: [PATCH 17/17] document JSON imports --- documentation/faq/70-packages.md | 6 ++++++ 1 file changed, 6 insertions(+) diff --git a/documentation/faq/70-packages.md b/documentation/faq/70-packages.md index 1f1c25f1ad7a..261f849564fc 100644 --- a/documentation/faq/70-packages.md +++ b/documentation/faq/70-packages.md @@ -4,6 +4,12 @@ question: How do I fix the error I'm getting trying to include a package? Old beta versions of the SvelteKit template included the configuration value `noExternal: Object.keys(pkg.dependencies || {})` in `svelte.config.js`. First, please check if this line is present in your project and remove it if so. Removing this line fixes most issues and has since been removed from the template. +> Note that you can no longer directly require JSON files, since SvelteKit expects [`svelte.config.js`](/docs#configuration) to be an ES module. You can load JSON like so: +> +> ```js +> const pkg = JSON.parse(fs.readFileSync(new URL('package.json', import.meta.url), 'utf8')); +> ``` + The second most commonly-encountered issue is having a Svelte component that imports a CommonJS library. In this case, you should try to work with the library authors to distribute an ESM version of the dependency. However, in the meantime, you can workaround this issue by adding the dependency to `vite.optimizeDeps.include` in `svelte.config.js`. Finally, Vite has had some issues that have been fixed, so we recommend upgrading to the latest version of Vite. If you are still encountering issues we recommend searching both [the Vite issue tracker](https://github.com/vitejs/vite/issues) and the issue tracker of the library in question. Sometimes issues can be worked around by fiddling with the [`optimizeDeps`](https://vitejs.dev/config/#dep-optimization-options) or [`ssr`](https://vitejs.dev/config/#ssr-options) config values.