Skip to content

Commit 61a37a5

Browse files
dominikgbluwybenmccann
authored
feat: enable nested optimization (#157)
* wip: enable nested optimization - reorganized test dependencies and added cjs/esm deps * fix: process cjs-only on vite build * chore: add optimization test * chore: update vite peer dep * chore: improve code formatting in _test_dependencies Co-authored-by: Ben McCann <322311+benmccann@users.noreply.github.com> * fix: update vite to 2.5.3 to consume fix for windows problem Co-authored-by: bluwy <bjornlu.dev@gmail.com> Co-authored-by: Ben McCann <322311+benmccann@users.noreply.github.com>
1 parent 908b838 commit 61a37a5

File tree

48 files changed

+252
-129
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

48 files changed

+252
-129
lines changed

.changeset/chatty-lemons-yell.md

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,7 @@
1+
---
2+
'@sveltejs/vite-plugin-svelte': major
3+
---
4+
5+
Enable optimization for nested dependencies of excluded svelte dependencies
6+
7+
Vite 2.5.3 and above is needed to support this feature.

package.json

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -65,7 +65,7 @@
6565
"svelte": "^3.42.4",
6666
"ts-jest": "^27.0.5",
6767
"typescript": "^4.4.2",
68-
"vite": "^2.5.2"
68+
"vite": "^2.5.3"
6969
},
7070
"lint-staged": {
7171
"*.{js,ts,svelte,html,md,svx}": "eslint --fix",
Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
This directory contains packages that are used as dependencies in various e2e tests
Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
module.exports = {
2+
cjs_and_esm: () => 'cjs'
3+
}
Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
export function cjs_and_esm() { return 'esm' };
Lines changed: 19 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,19 @@
1+
{
2+
"version": "1.0.0",
3+
"private": true,
4+
"name": "e2e-test-dep-cjs-and-esm",
5+
"main": "index.cjs",
6+
"module": "index.mjs",
7+
"files": [
8+
"package.json",
9+
"index.mjs",
10+
"index.cjs"
11+
],
12+
"exports":{
13+
".": {
14+
"import": "./index.mjs",
15+
"require": "./index.cjs"
16+
},
17+
"./package.json": "./package.json"
18+
}
19+
}
Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
module.exports = {
2+
cjs: () => 'cjs'
3+
};
Lines changed: 11 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,11 @@
1+
{
2+
"version": "1.0.0",
3+
"private": true,
4+
"name": "e2e-test-dep-cjs-only",
5+
"main": "index.js",
6+
"files": [
7+
"package.json",
8+
"index.js"
9+
],
10+
"type": "commonjs"
11+
}
Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
export function esm() {
2+
return 'esm';
3+
}
Lines changed: 18 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,18 @@
1+
{
2+
"version": "1.0.0",
3+
"private": true,
4+
"name": "e2e-test-dep-esm-only",
5+
"main": "index.js",
6+
"module": "index.js",
7+
"files": [
8+
"package.json",
9+
"index.cjs"
10+
],
11+
"exports":{
12+
".": {
13+
"import": "./index.js"
14+
},
15+
"./package.json": "./package.json"
16+
},
17+
"type": "module"
18+
}
Lines changed: 18 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,18 @@
1+
{
2+
"version": "1.0.0",
3+
"private": true,
4+
"name": "e2e-test-dep-svelte-nested",
5+
"svelte": "src/index.js",
6+
"main": "src/index.js",
7+
"files": [
8+
"src",
9+
"package.json"
10+
],
11+
"exports": {
12+
"./package.json": "./package.json"
13+
},
14+
"dependencies": {
15+
"e2e-test-dep-svelte-simple": "workspace:*",
16+
"e2e-test-dep-cjs-and-esm": "workspace:*"
17+
}
18+
}
Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,8 @@
1+
<script>
2+
export let id = 'id';
3+
export let message = '';
4+
import { cjs_and_esm } from 'e2e-test-dep-cjs-and-esm';
5+
</script>
6+
7+
<div {id}>{message}</div>
8+
<div id="cjs-and-esm">{cjs_and_esm()}</div>
Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,2 @@
1+
import Message from './components/Message.svelte';
2+
export { Message };
Lines changed: 10 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,10 @@
1+
{
2+
"version": "1.0.0",
3+
"private": true,
4+
"name": "e2e-test-dep-svelte-simple",
5+
"main": "index.js",
6+
"svelte": "index.js",
7+
"dependencies": {
8+
"e2e-test-dep-cjs-only": "workspace:*"
9+
}
10+
}

packages/e2e-tests/hmr-test-dependency/src/components/Dependency.svelte renamed to packages/e2e-tests/_test_dependencies/svelte-simple/src/components/Dependency.svelte

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,12 @@
11
<script>
22
const label = 'dependency-import';
3+
import * as cjsOnly from 'e2e-test-dep-cjs-only';
4+
const { cjs } = cjsOnly;
35
</script>
46

57
<div id="dependency-import"><span class="label">{label}</span></div>
68
<div id="sticky-dep" class="sticky-dep">sticky-dep</div>
9+
<div id="cjs-only-dependency">{cjs()}</div>
710

811
<style>
912
.label {

packages/e2e-tests/autoprefixer-browerslist/package.json

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -8,7 +8,7 @@
88
"preview": "vite preview"
99
},
1010
"dependencies": {
11-
"e2e-tests-hmr-test-dependency": "workspace:*"
11+
"e2e-test-dep-svelte-simple": "workspace:*"
1212
},
1313
"devDependencies": {
1414
"@sveltejs/vite-plugin-svelte": "workspace:*",
@@ -17,6 +17,6 @@
1717
"postcss-load-config": "^3.1.0",
1818
"svelte": "^3.42.4",
1919
"svelte-preprocess": "^4.8.0",
20-
"vite": "^2.5.2"
20+
"vite": "^2.5.3"
2121
}
2222
}

packages/e2e-tests/autoprefixer-browerslist/src/App.svelte

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
<script>
2-
import Dependency from 'e2e-tests-hmr-test-dependency';
2+
import Dependency from 'e2e-test-dep-svelte-simple';
33
</script>
44

55
<div class="sticky" id="#sticky">sticky-div</div>

packages/e2e-tests/autoprefixer-browerslist/vite.config.js

Lines changed: 6 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,12 @@ module.exports = defineConfig(() => {
77
build: {
88
// make build faster by skipping transforms and minification
99
target: 'esnext',
10-
minify: false
10+
minify: false,
11+
commonjsOptions: {
12+
// pnpm only symlinks packages, and vite wont process cjs deps not in
13+
// node_modules, so we add the cjs dep here
14+
include: [/node_modules/, /cjs-only/]
15+
}
1116
},
1217
server: {
1318
watch: {

packages/e2e-tests/configfile-custom/package.json

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -8,11 +8,11 @@
88
"preview": "vite preview"
99
},
1010
"dependencies": {
11-
"e2e-tests-hmr-test-dependency": "workspace:*"
11+
"e2e-test-dep-svelte-simple": "workspace:*"
1212
},
1313
"devDependencies": {
1414
"@sveltejs/vite-plugin-svelte": "workspace:*",
1515
"svelte": "^3.42.4",
16-
"vite": "^2.5.2"
16+
"vite": "^2.5.3"
1717
}
1818
}

packages/e2e-tests/configfile-custom/src/App.svelte

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
<script>
2-
import Dependency from 'e2e-tests-hmr-test-dependency';
2+
import Dependency from 'e2e-test-dep-svelte-simple';
33
import Child from './lib/Child.svelte';
44
</script>
55

packages/e2e-tests/configfile-custom/vite.config.js

Lines changed: 6 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -8,7 +8,12 @@ module.exports = defineConfig(() => {
88
build: {
99
// make build faster by skipping transforms and minification
1010
target: 'esnext',
11-
minify: false
11+
minify: false,
12+
commonjsOptions: {
13+
// pnpm only symlinks packages, and vite wont process cjs deps not in
14+
// node_modules, so we add the cjs dep here
15+
include: [/node_modules/, /cjs-only/]
16+
}
1217
},
1318
server: {
1419
watch: {

packages/e2e-tests/configfile-esm/package.json

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -8,13 +8,13 @@
88
"preview": "vite preview"
99
},
1010
"dependencies": {
11-
"e2e-tests-hmr-test-dependency": "workspace:*"
11+
"e2e-test-dep-svelte-simple": "workspace:*"
1212
},
1313
"devDependencies": {
1414
"@sveltejs/vite-plugin-svelte": "workspace:*",
1515
"svelte": "^3.42.4",
1616
"svelte-preprocess": "^4.8.0",
17-
"vite": "^2.5.2"
17+
"vite": "^2.5.3"
1818
},
1919
"type": "module"
2020
}

packages/e2e-tests/configfile-esm/src/App.svelte

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
<script>
2-
import Dependency from 'e2e-tests-hmr-test-dependency';
2+
import Dependency from 'e2e-test-dep-svelte-simple';
33
import Child from './lib/Child.svelte';
44
</script>
55

packages/e2e-tests/configfile-esm/vite.config.js

Lines changed: 6 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -8,7 +8,12 @@ export default defineConfig(({ command, mode }) => {
88
build: {
99
// make build faster by skipping transforms and minification
1010
target: 'esnext',
11-
minify: false
11+
minify: false,
12+
commonjsOptions: {
13+
// pnpm only symlinks packages, and vite wont process cjs deps not in
14+
// node_modules, so we add the cjs dep here
15+
include: [/node_modules/, /cjs-only/]
16+
}
1217
},
1318
server: {
1419
watch: {

packages/e2e-tests/custom-extensions/package.json

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -10,6 +10,6 @@
1010
"devDependencies": {
1111
"@sveltejs/vite-plugin-svelte": "workspace:*",
1212
"svelte": "^3.42.4",
13-
"vite": "^2.5.2"
13+
"vite": "^2.5.3"
1414
}
1515
}

packages/e2e-tests/hmr-test-dependency/package.json

Lines changed: 0 additions & 7 deletions
This file was deleted.

packages/e2e-tests/hmr/package.json

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -8,12 +8,12 @@
88
"preview": "vite preview"
99
},
1010
"dependencies": {
11-
"e2e-tests-hmr-test-dependency": "workspace:*"
11+
"e2e-test-dep-svelte-simple": "workspace:*"
1212
},
1313
"devDependencies": {
1414
"@sveltejs/vite-plugin-svelte": "workspace:*",
1515
"node-fetch": "^2.6.1",
1616
"svelte": "^3.42.4",
17-
"vite": "^2.5.2"
17+
"vite": "^2.5.3"
1818
}
1919
}

packages/e2e-tests/hmr/src/App.svelte

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
<script>
22
import StaticImport from './components/StaticImport.svelte';
3-
import Dependency from 'e2e-tests-hmr-test-dependency';
3+
import Dependency from 'e2e-test-dep-svelte-simple';
44
import HmrTest from './components/HmrTest.svelte';
55
let dynamicImportComponent;
66
function importDynamic() {

packages/e2e-tests/hmr/vite.config.js

Lines changed: 6 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -3,13 +3,15 @@ const { svelte } = require('@sveltejs/vite-plugin-svelte');
33

44
module.exports = defineConfig(({ command, mode }) => {
55
return {
6-
optimizeDeps: {
7-
exclude: ['e2e-tests-hmr-test-dependency']
8-
},
96
plugins: [svelte()],
107
build: {
118
minify: false,
12-
target: 'esnext'
9+
target: 'esnext',
10+
commonjsOptions: {
11+
// pnpm only symlinks packages, and vite wont process cjs deps not in
12+
// node_modules, so we add the cjs dep here
13+
include: [/node_modules/, /cjs-only/]
14+
}
1315
},
1416
server: {
1517
watch: {
Lines changed: 18 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,22 @@
1-
import { getText } from '../../testUtils';
1+
import fs from 'fs';
2+
import path from 'path';
3+
import { getText, isBuild } from '../../testUtils';
24

35
test('should render component imported via svelte field in package.json', async () => {
46
expect(await getText('#test-id')).toBe('svelte field works');
57
});
8+
9+
if (!isBuild) {
10+
test('should optimize nested deps of excluded svelte deps', () => {
11+
const vitePrebundleMetadata = path.resolve(__dirname, '../node_modules/.vite/_metadata.json');
12+
const metadataFile = fs.readFileSync(vitePrebundleMetadata, 'utf8');
13+
const metadata = JSON.parse(metadataFile);
14+
const optimizedPaths = Object.keys(metadata.optimized);
15+
expect(optimizedPaths).not.toContain('e2e-test-dep-svelte-nested');
16+
expect(optimizedPaths).not.toContain('e2e-test-dep-svelte-simple');
17+
expect(optimizedPaths).toContain('e2e-test-dep-svelte-nested > e2e-test-dep-cjs-and-esm');
18+
expect(optimizedPaths).toContain(
19+
'e2e-test-dep-svelte-nested > e2e-test-dep-svelte-simple > e2e-test-dep-cjs-only'
20+
);
21+
});
22+
}

packages/e2e-tests/package-json-svelte-field/package.json

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -8,11 +8,11 @@
88
"preview": "vite preview"
99
},
1010
"dependencies": {
11-
"e2e-tests-test-dependency-svelte-field": "workspace:*"
11+
"e2e-test-dep-svelte-nested": "workspace:*"
1212
},
1313
"devDependencies": {
1414
"@sveltejs/vite-plugin-svelte": "workspace:*",
1515
"svelte": "^3.42.4",
16-
"vite": "^2.5.2"
16+
"vite": "^2.5.3"
1717
}
1818
}
Lines changed: 1 addition & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,5 @@
11
<script>
2-
// eslint-disable-next-line node/no-missing-import
3-
import { Message } from 'e2e-tests-test-dependency-svelte-field';
2+
import { Message } from 'e2e-test-dep-svelte-nested';
43
</script>
54

65
<Message id="test-id" message="svelte field works" />

packages/e2e-tests/svelte-preprocess/package.json

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -12,6 +12,6 @@
1212
"svelte": "^3.42.4",
1313
"svelte-preprocess": "^4.8.0",
1414
"typescript": "^4.4.2",
15-
"vite": "^2.5.2"
15+
"vite": "^2.5.3"
1616
}
1717
}

packages/e2e-tests/test-dependency-svelte-field/package.json

Lines changed: 0 additions & 16 deletions
This file was deleted.

packages/e2e-tests/test-dependency-svelte-field/src/components/Message.svelte

Lines changed: 0 additions & 6 deletions
This file was deleted.

packages/e2e-tests/test-dependency-svelte-field/src/components/svelte.js

Lines changed: 0 additions & 2 deletions
This file was deleted.

packages/e2e-tests/ts-type-import/package.json

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -12,6 +12,6 @@
1212
"@tsconfig/svelte": "^2.0.1",
1313
"@types/node": "^16.7.8",
1414
"svelte-preprocess": "^4.8.0",
15-
"vite": "^2.5.2"
15+
"vite": "^2.5.3"
1616
}
1717
}

0 commit comments

Comments
 (0)