diff --git a/docs/preprocessing.md b/docs/preprocessing.md
index d8900a6c..5bb71a4b 100644
--- a/docs/preprocessing.md
+++ b/docs/preprocessing.md
@@ -70,8 +70,8 @@ The following options can be passed to the preprocessor. None are required:
| Option | Default | Description |
| --------------- | -------------------------------------------------------- | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| `markupTagName` | `"template"` | `string` that sets the name of the tag `svelte-preprocess` looks for markup in custom languages.
i.e `markup` makes it possible to write your markup between `` tag. |
-| `aliases` | `null` | A list of tuples `[alias: string, language: string]` that correlates an `alias` to a `language`
i.e `['cst', 'customLanguage']` means
`<... src="./file.cst">`
`<... lang="cst">`
`<... type="text/customLanguage">`
`<... type="application/customLanguage">`
are treated as `customLanguage`. |
-| preserve | `[]` | A `string` list of languages/aliases that shouldn't pass through the preprocessor. (i.e `ld+json`) |
+| `aliases` | `null` | A list of tuples `[alias: string, language: string]` that correlates an `alias` to a `language`
i.e `['cst', 'customLanguage']` means
`<... src="./file.cst">`
`<... lang="cst">`
are treated as `customLanguage`. |
+| `preserve` | `[]` | A `string` list of languages/aliases that shouldn't pass through the preprocessor. (i.e `ld+json`) |
| `sourceMap` | `false` | If `true`, `svelte-preprocess` generates sourcemap for every language that supports it. |
##### Configuring preprocessors
@@ -133,7 +133,7 @@ export default {
};
```
-Now `svelte-preprocess` will use the `potatoLanguage` preprocessor whenever it finds a tag with `lang="potato"`, `type="text/potatoLanguage"` or `src="./index.pot"`.
+Now `svelte-preprocess` will use the `potatoLanguage` preprocessor whenever it finds a tag with `lang="potato"` or `src="./index.pot"`.
These methods receive the same arguments and act exactly like a [common svelte preprocessor](https://svelte.dev/docs#svelte_preprocess), but the concept of `markup`/`style`/`script` is abstracted as they are executed whenever `svelte-preprocess` find the aforementioned attributes.
@@ -273,7 +273,7 @@ The PostCSS preprocessor accepts four options:
In auto-preprocessing mode, you can set `postcss: true` if `postcss-load-config` is installed and `svelte-preprocess` will look for a PostCSS config file in your project.
-When a `lang="sugarss"`/`type="text/sugarss"` is found, `sugarss` is automatically loaded and extra indentation is removed.
+When a `lang="sugarss"` is found, `sugarss` is automatically loaded and extra indentation is removed.
You can check the [PostCSS API reference](https://api.postcss.org/) for PostCSS specific options.
@@ -356,7 +356,7 @@ You can check the [Sass API reference](https://sass-lang.com/documentation/js-ap
Note: `svelte-preprocess` automatically configures inclusion paths for your root directory, `node_modules` and for the current file's directory.
-Note: when a `lang="sass"`/`type="text/sass"` is found, `indentedSyntax` is automatically set to `true`.
+Note: when a `lang="sass"` is found, `indentedSyntax` is automatically set to `true`.
Note: `sass`, with indented syntax, and `scss` are not interchangeable so make sure to configure the correct one that fits your needs.
diff --git a/examples/sapper-rollup/src/routes/blog/index.svelte b/examples/sapper-rollup/src/routes/blog/index.svelte
index 9a713ba7..37de37d5 100644
--- a/examples/sapper-rollup/src/routes/blog/index.svelte
+++ b/examples/sapper-rollup/src/routes/blog/index.svelte
@@ -8,7 +8,7 @@
}
-
-
\ No newline at end of file
diff --git a/src/modules/language.ts b/src/modules/language.ts
index 40bb4d3d..c4e7cf09 100644
--- a/src/modules/language.ts
+++ b/src/modules/language.ts
@@ -3,6 +3,10 @@ import { basename } from 'path';
import type { PreprocessorArgs } from '../types';
import { isValidLocalPath } from './utils';
+// todo: remove on v5
+let hasLoggedDeprecatedLangTypescriptWarning = false;
+let hasLoggedDeprecatedTypeWarning = false;
+
const LANGUAGE_DEFAULTS: Record = {
sass: {
indentedSyntax: true,
@@ -85,6 +89,13 @@ export const getLanguage = (attributes: PreprocessorArgs['attributes']) => {
}
alias = attributes.lang;
+
+ if (alias === 'typescript' && !hasLoggedDeprecatedLangTypescriptWarning) {
+ hasLoggedDeprecatedLangTypescriptWarning = true;
+ console.warn(
+ `[svelte-preprocess] Deprecation notice: using 'lang="typescript"' is no longer recommended and will be removed in the next major version. Please use 'lang="ts"' instead.`,
+ );
+ }
} else if (attributes.type) {
// istanbul ignore if
if (typeof attributes.type !== 'string') {
@@ -92,6 +103,13 @@ export const getLanguage = (attributes: PreprocessorArgs['attributes']) => {
}
alias = attributes.type.replace(/^(text|application)\/(.*)$/, '$2');
+
+ if (attributes.type.includes('text/') && !hasLoggedDeprecatedTypeWarning) {
+ hasLoggedDeprecatedTypeWarning = true;
+ console.warn(
+ `[svelte-preprocess] Deprecation notice: using the "type" attribute is no longer recommended and will be removed in the next major version. Please use the "lang" attribute instead.`,
+ );
+ }
} else if (
typeof attributes.src === 'string' &&
isValidLocalPath(attributes.src)
diff --git a/test/transformers/typescript.test.ts b/test/transformers/typescript.test.ts
index c4366801..12ea3d88 100644
--- a/test/transformers/typescript.test.ts
+++ b/test/transformers/typescript.test.ts
@@ -31,7 +31,7 @@ const autoProcessTS = (content: string, compilerOptions?: any) => {
return opts.script?.({
content,
markup: ``,
- attributes: { type: 'text/typescript' },
+ attributes: { lang: 'ts' },
filename: resolve(__dirname, '..', 'App.svelte'),
}) as Processed & { diagnostics: Diagnostic[] };
};