Skip to content

feat: ignore component options in compileModule #16362

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
wants to merge 1 commit into
base: main
Choose a base branch
from
Open
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
5 changes: 5 additions & 0 deletions .changeset/violet-ways-sleep.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,5 @@
---
'svelte': minor
---

feat: ignore component options in `compileModule`
172 changes: 91 additions & 81 deletions packages/svelte/src/compiler/validate-options.js
Original file line number Diff line number Diff line change
Expand Up @@ -8,7 +8,7 @@ import * as w from './warnings.js';
* @typedef {(input: Input, keypath: string) => Required<Output>} Validator
*/

const common = {
const common_options = {
filename: string('(unknown)'),

// default to process.cwd() where it exists to replicate svelte4 behavior (and make Deno work with this as well)
Expand Down Expand Up @@ -44,110 +44,120 @@ const common = {
warningFilter: fun(() => true)
};

export const validate_module_options =
/** @type {Validator<ModuleCompileOptions, ValidatedModuleCompileOptions>} */ (
object({
...common
})
);
const component_options = {
accessors: deprecate(w.options_deprecated_accessors, boolean(false)),

export const validate_component_options =
/** @type {Validator<CompileOptions, ValidatedCompileOptions>} */ (
object({
...common,
css: validator('external', (input) => {
if (input === true || input === false) {
throw_error(
'The boolean options have been removed from the css option. Use "external" instead of false and "injected" instead of true'
);
}
if (input === 'none') {
throw_error(
'css: "none" is no longer a valid option. If this was crucial for you, please open an issue on GitHub with your use case.'
);
}

accessors: deprecate(w.options_deprecated_accessors, boolean(false)),
if (input !== 'external' && input !== 'injected') {
throw_error(`css should be either "external" (default, recommended) or "injected"`);
}

css: validator('external', (input) => {
if (input === true || input === false) {
throw_error(
'The boolean options have been removed from the css option. Use "external" instead of false and "injected" instead of true'
);
}
if (input === 'none') {
throw_error(
'css: "none" is no longer a valid option. If this was crucial for you, please open an issue on GitHub with your use case.'
);
}
return input;
}),

if (input !== 'external' && input !== 'injected') {
throw_error(`css should be either "external" (default, recommended) or "injected"`);
}
cssHash: fun(({ css, hash }) => {
return `svelte-${hash(css)}`;
}),

// TODO this is a sourcemap option, would be good to put under a sourcemap namespace
cssOutputFilename: string(undefined),

customElement: boolean(false),

discloseVersion: boolean(true),

return input;
}),
immutable: deprecate(w.options_deprecated_immutable, boolean(false)),

cssHash: fun(({ css, hash }) => {
return `svelte-${hash(css)}`;
}),
legacy: removed(
'The legacy option has been removed. If you are using this because of legacy.componentApi, use compatibility.componentApi instead'
),

compatibility: object({
componentApi: list([4, 5], 5)
}),

loopGuardTimeout: warn_removed(w.options_removed_loop_guard_timeout),

name: string(undefined),

// TODO this is a sourcemap option, would be good to put under a sourcemap namespace
cssOutputFilename: string(undefined),
namespace: list(['html', 'mathml', 'svg']),

customElement: boolean(false),
modernAst: boolean(false),

discloseVersion: boolean(true),
outputFilename: string(undefined),

immutable: deprecate(w.options_deprecated_immutable, boolean(false)),
preserveComments: boolean(false),

legacy: removed(
'The legacy option has been removed. If you are using this because of legacy.componentApi, use compatibility.componentApi instead'
),
fragments: list(['html', 'tree']),

compatibility: object({
componentApi: list([4, 5], 5)
}),
preserveWhitespace: boolean(false),

loopGuardTimeout: warn_removed(w.options_removed_loop_guard_timeout),
runes: boolean(undefined),

name: string(undefined),
hmr: boolean(false),

namespace: list(['html', 'mathml', 'svg']),
sourcemap: validator(undefined, (input) => {
// Source maps can take on a variety of values, including string, JSON, map objects from magic-string and source-map,
// so there's no good way to check type validity here
return input;
}),

modernAst: boolean(false),
enableSourcemap: warn_removed(w.options_removed_enable_sourcemap),

outputFilename: string(undefined),
hydratable: warn_removed(w.options_removed_hydratable),

preserveComments: boolean(false),
format: removed(
'The format option has been removed in Svelte 4, the compiler only outputs ESM now. Remove "format" from your compiler options. ' +
'If you did not set this yourself, bump the version of your bundler plugin (vite-plugin-svelte/rollup-plugin-svelte/svelte-loader)'
),

fragments: list(['html', 'tree']),
tag: removed(
'The tag option has been removed in Svelte 5. Use `<svelte:options customElement="tag-name" />` inside the component instead. ' +
'If that does not solve your use case, please open an issue on GitHub with details.'
),

preserveWhitespace: boolean(false),
sveltePath: removed(
'The sveltePath option has been removed in Svelte 5. ' +
'If this option was crucial for you, please open an issue on GitHub with your use case.'
),

runes: boolean(undefined),
// These two were primarily created for svelte-preprocess (https://github.com/sveltejs/svelte/pull/6194),
// but with new TypeScript compilation modes strictly separating types it's not necessary anymore
errorMode: removed(
'The errorMode option has been removed. If you are using this through svelte-preprocess with TypeScript, ' +
'use the https://www.typescriptlang.org/tsconfig#verbatimModuleSyntax setting instead'
),

hmr: boolean(false),
varsReport: removed(
'The vars option has been removed. If you are using this through svelte-preprocess with TypeScript, ' +
'use the https://www.typescriptlang.org/tsconfig#verbatimModuleSyntax setting instead'
)
};

sourcemap: validator(undefined, (input) => {
// Source maps can take on a variety of values, including string, JSON, map objects from magic-string and source-map,
// so there's no good way to check type validity here
return input;
}),
export const validate_module_options =
/** @type {Validator<ModuleCompileOptions, ValidatedModuleCompileOptions>} */ (
object({
...common_options,
...Object.fromEntries(Object.keys(component_options).map((key) => [key, () => {}]))
})
);

enableSourcemap: warn_removed(w.options_removed_enable_sourcemap),
hydratable: warn_removed(w.options_removed_hydratable),
format: removed(
'The format option has been removed in Svelte 4, the compiler only outputs ESM now. Remove "format" from your compiler options. ' +
'If you did not set this yourself, bump the version of your bundler plugin (vite-plugin-svelte/rollup-plugin-svelte/svelte-loader)'
),
tag: removed(
'The tag option has been removed in Svelte 5. Use `<svelte:options customElement="tag-name" />` inside the component instead. ' +
'If that does not solve your use case, please open an issue on GitHub with details.'
),
sveltePath: removed(
'The sveltePath option has been removed in Svelte 5. ' +
'If this option was crucial for you, please open an issue on GitHub with your use case.'
),
// These two were primarily created for svelte-preprocess (https://github.com/sveltejs/svelte/pull/6194),
// but with new TypeScript compilation modes strictly separating types it's not necessary anymore
errorMode: removed(
'The errorMode option has been removed. If you are using this through svelte-preprocess with TypeScript, ' +
'use the https://www.typescriptlang.org/tsconfig#verbatimModuleSyntax setting instead'
),
varsReport: removed(
'The vars option has been removed. If you are using this through svelte-preprocess with TypeScript, ' +
'use the https://www.typescriptlang.org/tsconfig#verbatimModuleSyntax setting instead'
)
export const validate_component_options =
/** @type {Validator<CompileOptions, ValidatedCompileOptions>} */ (
object({
...common_options,
...component_options
})
);

Expand Down
Loading