diff --git a/.changeset/cuddly-files-decide.md b/.changeset/cuddly-files-decide.md new file mode 100644 index 0000000000000..aadb25b099e03 --- /dev/null +++ b/.changeset/cuddly-files-decide.md @@ -0,0 +1,5 @@ +--- +'@sveltejs/kit': patch +--- + +[fix] enable Vite pre-bundling except for Svelte packages diff --git a/packages/kit/src/core/build/index.js b/packages/kit/src/core/build/index.js index 07d7122ee2e48..3423f1561c704 100644 --- a/packages/kit/src/core/build/index.js +++ b/packages/kit/src/core/build/index.js @@ -2,7 +2,7 @@ import fs from 'fs'; import path from 'path'; import { rimraf } from '../filesystem/index.js'; import create_manifest_data from '../../core/create_manifest_data/index.js'; -import { copy_assets, get_no_external, posixify, resolve_entry } from '../utils.js'; +import { copy_assets, get_svelte_packages, posixify, resolve_entry } from '../utils.js'; import { deep_merge, print_config_conflicts } from '../config/index.js'; import { create_app } from '../../core/create_app/index.js'; import vite from 'vite'; @@ -33,6 +33,7 @@ export async function build(config, { cwd = process.cwd(), runtime = '@sveltejs/ rimraf(build_dir); const output_dir = path.resolve(cwd, `${SVELTE_KIT}/output`); + const svelte_packages = get_svelte_packages(cwd); const options = { cwd, @@ -49,7 +50,8 @@ export async function build(config, { cwd = process.cwd(), runtime = '@sveltejs/ }), output_dir, client_entry_file: `${SVELTE_KIT}/build/runtime/internal/start.js`, - service_worker_entry_file: resolve_entry(config.kit.files.serviceWorker) + service_worker_entry_file: resolve_entry(config.kit.files.serviceWorker), + svelte_packages }; const client_manifest = await build_client(options); @@ -132,7 +134,7 @@ async function build_client({ }); /** @type {any} */ - const user_config = config.kit.vite(); + const vite_config = config.kit.vite(); const default_config = { server: { @@ -143,10 +145,10 @@ async function build_client({ }; // don't warn on overriding defaults - const [modified_user_config] = deep_merge(default_config, user_config); + const [modified_vite_config] = deep_merge(default_config, vite_config); /** @type {[any, string[]]} */ - const [merged_config, conflicts] = deep_merge(modified_user_config, { + const [merged_config, conflicts] = deep_merge(modified_vite_config, { configFile: false, root: cwd, base, @@ -203,6 +205,7 @@ async function build_client({ * output_dir: string; * client_entry_file: string; * service_worker_entry_file: string | null; + * svelte_packages: string[]; * }} options * @param {ClientManifest} client_manifest * @param {string} runtime @@ -216,7 +219,8 @@ async function build_server( build_dir, output_dir, client_entry_file, - service_worker_entry_file + service_worker_entry_file, + svelte_packages }, client_manifest, runtime @@ -419,8 +423,8 @@ async function build_server( .trim() ); - /** @type {any} */ - const user_config = config.kit.vite(); + /** @type {import('vite').UserConfig} */ + const vite_config = config.kit.vite(); const default_config = { server: { @@ -431,10 +435,10 @@ async function build_server( }; // don't warn on overriding defaults - const [modified_user_config] = deep_merge(default_config, user_config); + const [modified_vite_config] = deep_merge(default_config, vite_config); /** @type {[any, string[]]} */ - const [merged_config, conflicts] = deep_merge(modified_user_config, { + const [merged_config, conflicts] = deep_merge(modified_vite_config, { configFile: false, root: cwd, base, @@ -457,11 +461,11 @@ async function build_server( preserveEntrySignatures: 'strict' } }, - resolve: { - alias: { - $app: path.resolve(`${build_dir}/runtime/app`), - $lib: config.kit.files.lib - } + optimizeDeps: { + exclude: [ + ...((vite_config.optimizeDeps && vite_config.optimizeDeps.exclude) || []), + ...svelte_packages + ] }, plugins: [ svelte({ @@ -471,16 +475,17 @@ async function build_server( } }) ], - // this API is marked as @alpha https://github.com/vitejs/vite/blob/27785f7fcc5b45987b5f0bf308137ddbdd9f79ea/packages/vite/src/node/config.ts#L129 - // it's not exposed in the typescript definitions as a result - // so we need to ignore the fact that it's missing + resolve: { + alias: { + $app: path.resolve(`${build_dir}/runtime/app`), + $lib: config.kit.files.lib + } + }, ssr: { // note to self: this _might_ need to be ['svelte', '@sveltejs/kit', ...get_no_external()] // but I'm honestly not sure. roll with this for now and see if it's ok - noExternal: get_no_external(cwd, user_config.ssr && user_config.ssr.noExternal) - }, - optimizeDeps: { - entries: [] + // @ts-expect-error ssr is considered in alpha, so not yet exposed by Vite + noExternal: [...((vite_config.ssr && vite_config.ssr.noExternal) || []), ...svelte_packages] } }); @@ -499,11 +504,21 @@ async function build_server( * output_dir: string; * client_entry_file: string; * service_worker_entry_file: string | null; + * svelte_packages: string[]; * }} options * @param {ClientManifest} client_manifest */ async function build_service_worker( - { cwd, base, config, manifest, build_dir, output_dir, service_worker_entry_file }, + { + cwd, + base, + config, + manifest, + build_dir, + output_dir, + service_worker_entry_file, + svelte_packages + }, client_manifest ) { // TODO add any assets referenced in template .html file, e.g. favicon? @@ -540,7 +555,7 @@ async function build_service_worker( ); /** @type {any} */ - const user_config = config.kit.vite(); + const vite_config = config.kit.vite(); const default_config = { server: { @@ -551,10 +566,10 @@ async function build_service_worker( }; // don't warn on overriding defaults - const [modified_user_config] = deep_merge(default_config, user_config); + const [modified_vite_config] = deep_merge(default_config, vite_config); /** @type {[any, string[]]} */ - const [merged_config, conflicts] = deep_merge(modified_user_config, { + const [merged_config, conflicts] = deep_merge(modified_vite_config, { configFile: false, root: cwd, base, @@ -572,13 +587,16 @@ async function build_service_worker( outDir: `${output_dir}/client`, emptyOutDir: false }, + optimizeDeps: { + exclude: [ + ...((vite_config.optimizeDeps && vite_config.optimizeDeps.exclude) || []), + ...svelte_packages + ] + }, resolve: { alias: { '$service-worker': path.resolve(`${build_dir}/runtime/service-worker`) } - }, - optimizeDeps: { - entries: [] } }); diff --git a/packages/kit/src/core/dev/index.js b/packages/kit/src/core/dev/index.js index b6be54f0bead1..001e8abfaa3e3 100644 --- a/packages/kit/src/core/dev/index.js +++ b/packages/kit/src/core/dev/index.js @@ -11,7 +11,7 @@ import { create_app } from '../../core/create_app/index.js'; import { rimraf } from '../filesystem/index.js'; import { respond } from '../../runtime/server/index.js'; import { getRawBody } from '../node/index.js'; -import { copy_assets, get_no_external, resolve_entry } from '../utils.js'; +import { copy_assets, get_svelte_packages, resolve_entry } from '../utils.js'; import { deep_merge, print_config_conflicts } from '../config/index.js'; import { svelte } from '@sveltejs/vite-plugin-svelte'; import { get_server } from '../server/index.js'; @@ -112,6 +112,8 @@ class Watcher extends EventEmitter { // don't warn on overriding defaults const [modified_vite_config] = deep_merge(default_config, vite_config); + const svelte_packages = get_svelte_packages(this.cwd); + /** @type {[any, string[]]} */ const [merged_config, conflicts] = deep_merge(modified_vite_config, { configFile: false, @@ -140,6 +142,12 @@ class Watcher extends EventEmitter { input: path.resolve(`${this.dir}/runtime/internal/start.js`) } }, + optimizeDeps: { + exclude: [ + ...((vite_config.optimizeDeps && vite_config.optimizeDeps.exclude) || []), + ...svelte_packages + ] + }, plugins: [ svelte({ extensions: this.config.extensions, @@ -156,12 +164,9 @@ class Watcher extends EventEmitter { ...(this.https ? { server: this.server, port: this.port } : {}) } }, - optimizeDeps: { - entries: [] - }, ssr: { - // @ts-expect-error ssr is considered in beta, so not exposed by Vite - noExternal: get_no_external(this.cwd, vite_config.ssr && vite_config.ssr.noExternal) + // @ts-expect-error ssr is considered in alpha, so not yet exposed by Vite + noExternal: [...((vite_config.ssr && vite_config.ssr.noExternal) || []), ...svelte_packages] } }); diff --git a/packages/kit/src/core/utils.js b/packages/kit/src/core/utils.js index 32dae8a76923b..8ca06be8ad75e 100644 --- a/packages/kit/src/core/utils.js +++ b/packages/kit/src/core/utils.js @@ -82,7 +82,7 @@ export function posixify(str) { * @param {string} cwd * @returns {string[]} */ -function find_svelte_packages(cwd) { +export function get_svelte_packages(cwd) { const pkg_file = path.join(cwd, 'package.json'); if (!fs.existsSync(pkg_file)) return []; @@ -98,11 +98,3 @@ function find_svelte_packages(cwd) { return !!dep_pkg.svelte; }); } - -/** - * @param {string} cwd - * @param {string[]} [user_specified_deps] - */ -export function get_no_external(cwd, user_specified_deps = []) { - return [...user_specified_deps, ...find_svelte_packages(cwd)]; -}