Skip to content
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

fix: import ts with .js extension #324

Merged
merged 12 commits into from May 8, 2022
Merged
Show file tree
Hide file tree
Changes from 8 commits
Commits
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Jump to
Jump to file
Failed to load files.
Diff view
Diff view
5 changes: 5 additions & 0 deletions .changeset/slow-dolphins-turn.md
@@ -0,0 +1,5 @@
---
'@sveltejs/vite-plugin-svelte': patch
---

Support import typescript files with .js extension
3 changes: 2 additions & 1 deletion .eslintrc.js
Expand Up @@ -99,7 +99,8 @@ module.exports = {
'import/first': 'off',
'import/no-duplicates': 'off',
'import/no-mutable-exports': 'off',
'import/no-unresolved': 'off'
'import/no-unresolved': 'off',
'node/no-missing-import': 'off' // doesn't work with typescript's "import from 'src/foo.js'" for src/foo.ts
}
},
{
Expand Down
4 changes: 2 additions & 2 deletions package.json
Expand Up @@ -56,7 +56,7 @@
"svelte": "^3.47.0",
"ts-jest": "^27.1.4",
"typescript": "^4.6.3",
"vite": "^2.9.5"
"vite": "^2.9.8"
},
"lint-staged": {
"*.{js,ts,svelte,html,md,svx}": "eslint --fix",
Expand All @@ -77,4 +77,4 @@
"node-fetch@2": "^2.6.7"
}
}
}
}
2 changes: 1 addition & 1 deletion packages/e2e-tests/autoprefixer-browerslist/package.json
Expand Up @@ -17,6 +17,6 @@
"postcss-load-config": "^3.1.4",
"svelte": "^3.47.0",
"svelte-preprocess": "^4.10.6",
"vite": "^2.9.5"
"vite": "^2.9.8"
}
}
2 changes: 1 addition & 1 deletion packages/e2e-tests/configfile-custom/package.json
Expand Up @@ -13,6 +13,6 @@
"devDependencies": {
"@sveltejs/vite-plugin-svelte": "workspace:*",
"svelte": "^3.47.0",
"vite": "^2.9.5"
"vite": "^2.9.8"
}
}
2 changes: 1 addition & 1 deletion packages/e2e-tests/configfile-esm/package.json
Expand Up @@ -14,7 +14,7 @@
"@sveltejs/vite-plugin-svelte": "workspace:*",
"svelte": "^3.47.0",
"svelte-preprocess": "^4.10.6",
"vite": "^2.9.5"
"vite": "^2.9.8"
},
"type": "module"
}
2 changes: 1 addition & 1 deletion packages/e2e-tests/custom-extensions/package.json
Expand Up @@ -10,6 +10,6 @@
"devDependencies": {
"@sveltejs/vite-plugin-svelte": "workspace:*",
"svelte": "^3.47.0",
"vite": "^2.9.5"
"vite": "^2.9.8"
}
}
2 changes: 1 addition & 1 deletion packages/e2e-tests/env/package.json
Expand Up @@ -10,7 +10,7 @@
"devDependencies": {
"@sveltejs/vite-plugin-svelte": "workspace:*",
"svelte": "^3.47.0",
"vite": "^2.9.5"
"vite": "^2.9.8"
},
"type": "module"
}
2 changes: 1 addition & 1 deletion packages/e2e-tests/hmr/package.json
Expand Up @@ -15,6 +15,6 @@
"e2e-test-dep-vite-plugins": "workspace:*",
"node-fetch": "^2.6.7",
"svelte": "^3.47.0",
"vite": "^2.9.5"
"vite": "^2.9.8"
}
}
2 changes: 1 addition & 1 deletion packages/e2e-tests/package-json-svelte-field/package.json
Expand Up @@ -14,6 +14,6 @@
"devDependencies": {
"@sveltejs/vite-plugin-svelte": "workspace:*",
"svelte": "^3.47.0",
"vite": "^2.9.5"
"vite": "^2.9.8"
}
}
2 changes: 1 addition & 1 deletion packages/e2e-tests/preprocess-with-vite/package.json
Expand Up @@ -12,6 +12,6 @@
"sass": "^1.50.1",
"stylus": "^0.57.0",
"svelte": "^3.47.0",
"vite": "^2.9.5"
"vite": "^2.9.8"
}
}
2 changes: 1 addition & 1 deletion packages/e2e-tests/svelte-preprocess/package.json
Expand Up @@ -12,6 +12,6 @@
"svelte": "^3.47.0",
"svelte-preprocess": "^4.10.6",
"typescript": "^4.6.3",
"vite": "^2.9.5"
"vite": "^2.9.8"
}
}
Expand Up @@ -2,6 +2,7 @@ import { isBuild, getText, editFileAndWaitForHmrComplete } from '../../testUtils

test('should render App', async () => {
expect(await getText('#hello')).toBe('Hello world');
expect(await getText('#foobar')).toBe('foobar');
});

if (!isBuild) {
Expand Down
2 changes: 1 addition & 1 deletion packages/e2e-tests/ts-type-import/package.json
Expand Up @@ -12,6 +12,6 @@
"@tsconfig/svelte": "^3.0.0",
"@types/node": "^17.0.21",
"svelte-preprocess": "^4.10.6",
"vite": "^2.9.5"
"vite": "^2.9.8"
}
}
2 changes: 2 additions & 0 deletions packages/e2e-tests/ts-type-import/src/App.svelte
@@ -1,5 +1,7 @@
<script lang="ts">
import { foobar } from './foobar.js';
let s: string = 'world';
</script>

<div id="hello">Hello {s}</div>
<div id="foobar">{foobar()}</div>
3 changes: 3 additions & 0 deletions packages/e2e-tests/ts-type-import/src/foobar.ts
@@ -0,0 +1,3 @@
export function foobar() {
return 'foobar';
}
2 changes: 1 addition & 1 deletion packages/e2e-tests/vite-ssr-esm/package.json
Expand Up @@ -21,6 +21,6 @@
"npm-run-all": "^4.1.5",
"serve-static": "^1.15.0",
"svelte": "^3.47.0",
"vite": "^2.9.5"
"vite": "^2.9.8"
}
}
2 changes: 1 addition & 1 deletion packages/e2e-tests/vite-ssr/package.json
Expand Up @@ -18,6 +18,6 @@
"express": "^4.17.3",
"serve-static": "^1.15.0",
"svelte": "^3.47.0",
"vite": "^2.9.5"
"vite": "^2.9.8"
}
}
2 changes: 1 addition & 1 deletion packages/playground/big-component-library/package.json
Expand Up @@ -12,7 +12,7 @@
"@sveltejs/vite-plugin-svelte": "workspace:*",
"carbon-components-svelte": "^0.63.1",
"svelte": "^3.47.0",
"vite": "^2.9.5"
"vite": "^2.9.8"
},
"dependencies": {
"lodash-es": "^4.17.21"
Expand Down
2 changes: 1 addition & 1 deletion packages/playground/big/package.json
Expand Up @@ -10,6 +10,6 @@
"devDependencies": {
"@sveltejs/vite-plugin-svelte": "workspace:*",
"svelte": "^3.47.0",
"vite": "^2.9.5"
"vite": "^2.9.8"
}
}
2 changes: 1 addition & 1 deletion packages/playground/optimizedeps-include/package.json
Expand Up @@ -12,6 +12,6 @@
"@sveltejs/vite-plugin-svelte": "workspace:*",
"svelte": "^3.47.0",
"tinro": "^0.6.12",
"vite": "^2.9.5"
"vite": "^2.9.8"
}
}
2 changes: 1 addition & 1 deletion packages/playground/windicss/package.json
Expand Up @@ -14,7 +14,7 @@
"@sveltejs/vite-plugin-svelte": "workspace:*",
"diff-match-patch": "^1.0.5",
"svelte": "^3.47.0",
"vite": "^2.9.5",
"vite": "^2.9.8",
"vite-plugin-windicss": "^1.8.4"
}
}
2 changes: 1 addition & 1 deletion packages/vite-plugin-svelte/package.json
Expand Up @@ -69,6 +69,6 @@
"rollup": "^2.70.2",
"svelte": "^3.47.0",
"tsup": "^5.12.5",
"vite": "^2.9.5"
"vite": "^2.9.8"
}
}
9 changes: 8 additions & 1 deletion packages/vite-plugin-svelte/src/index.ts
Expand Up @@ -176,7 +176,14 @@ export function svelte(inlineOptions?: Partial<Options>): Plugin {
});
}
log.debug(`transform returns compiled js for ${svelteRequest.filename}`);
return compileData.compiled.js;
return {
...compileData.compiled.js,
meta: {
vite: {
lang: compileData.lang
}
}
};
},

handleHotUpdate(ctx: HmrContext): void | Promise<Array<ModuleNode> | void> {
Expand Down
17 changes: 14 additions & 3 deletions packages/vite-plugin-svelte/src/utils/compile.ts
Expand Up @@ -5,9 +5,13 @@ import { createMakeHot } from 'svelte-hmr';
import { SvelteRequest } from './id';
import { safeBase64Hash } from './hash';
import { log } from './log';
import { createSpyLangPreprocessor } from './preprocess';

const _createCompileSvelte = (makeHot: Function) =>
async function compileSvelte(
const _createCompileSvelte = (makeHot: Function) => {
const spyLangMap = new Map<string, string>();
const spyLangPreprocessor = createSpyLangPreprocessor(spyLangMap);

return async function compileSvelte(
svelteRequest: SvelteRequest,
code: string,
options: Partial<ResolvedOptions>
Expand Down Expand Up @@ -37,8 +41,12 @@ const _createCompileSvelte = (makeHot: Function) =>
let preprocessed;

if (options.preprocess) {
const preprocessors = [
spyLangPreprocessor,
...(Array.isArray(options.preprocess) ? options.preprocess : [options.preprocess])
];
try {
preprocessed = await preprocess(code, options.preprocess, { filename });
preprocessed = await preprocess(code, preprocessors, { filename });
} catch (e) {
e.message = `Error while preprocessing ${filename}${e.message ? ` - ${e.message}` : ''}`;
throw e;
Expand Down Expand Up @@ -88,12 +96,14 @@ const _createCompileSvelte = (makeHot: Function) =>
return {
filename,
normalizedFilename,
lang: spyLangMap.get(filename) || 'js',
// @ts-ignore
compiled,
ssr,
dependencies
};
};
};

function buildMakeHot(options: ResolvedOptions) {
const needsMakeHot = options.hot !== false && options.isServe && !options.isProduction;
Expand Down Expand Up @@ -148,6 +158,7 @@ export interface Compiled {
export interface CompileData {
filename: string;
normalizedFilename: string;
lang: string;
compiled: Compiled;
ssr: boolean | undefined;
dependencies: string[];
Expand Down
10 changes: 10 additions & 0 deletions packages/vite-plugin-svelte/src/utils/preprocess.ts
Expand Up @@ -194,6 +194,16 @@ export function addExtraPreprocessors(options: ResolvedOptions, config: Resolved
}
}

export function createSpyLangPreprocessor(map: Map<string, string>): PreprocessorGroup {
return {
script({ attributes, filename }) {
if (filename && attributes.lang) {
map.set(filename, attributes.lang as string);
bluwy marked this conversation as resolved.
Show resolved Hide resolved
}
}
};
}

function validateSourceMapOutputWrapper(group: PreprocessorGroup, i: number): PreprocessorGroup {
const wrapper: PreprocessorGroup = {};

Expand Down