Skip to content
This repository was archived by the owner on Feb 17, 2023. It is now read-only.

Commit d4a52ed

Browse files
NikhilVermaantfu
NikhilVerma
and
antfu
authored
feat: migrate vite-plugin-vue2 to use vue-template-babel-compiler (#179)
Co-authored-by: Anthony Fu <[email protected]>
1 parent 2ac7dd8 commit d4a52ed

File tree

15 files changed

+2083
-1971
lines changed

15 files changed

+2083
-1971
lines changed

‎.gitignore‎

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -4,4 +4,5 @@ dist
44
*.local
55
yarn-error.log
66
.idea/
7-
.history/
7+
.history/
8+
.vscode

‎.npmignore‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
playground

‎.prettierrc‎

Lines changed: 5 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,5 @@
1-
semi: false
2-
singleQuote: true
3-
printWidth: 80
1+
{
2+
"semi": false,
3+
"singleQuote": true,
4+
"printWidth": 80
5+
}

‎index.d.ts‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1 +1 @@
1-
declare module 'vue-template-es2015-compiler'
1+
declare module 'vue-template-babel-compiler'

‎package.json‎

Lines changed: 17 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -44,6 +44,15 @@
4444
"@babel/parser": "^7.16.10",
4545
"@babel/plugin-proposal-class-properties": "^7.16.7",
4646
"@babel/plugin-proposal-decorators": "^7.16.7",
47+
"@babel/plugin-proposal-nullish-coalescing-operator": "^7.14.5",
48+
"@babel/plugin-proposal-object-rest-spread": "^7.15.6",
49+
"@babel/plugin-proposal-optional-chaining": "^7.14.2",
50+
"@babel/plugin-transform-arrow-functions": "^7.14.5",
51+
"@babel/plugin-transform-block-scoping": "^7.14.5",
52+
"@babel/plugin-transform-computed-properties": "^7.14.5",
53+
"@babel/plugin-transform-destructuring": "^7.14.5",
54+
"@babel/plugin-transform-parameters": "^7.14.5",
55+
"@babel/plugin-transform-spread": "^7.14.5",
4756
"@babel/plugin-transform-typescript": "^7.16.8",
4857
"@rollup/pluginutils": "^4.1.1",
4958
"@vue/babel-helper-vue-jsx-merge-props": "^1.2.1",
@@ -59,7 +68,7 @@
5968
"rollup": "^2.58.0",
6069
"slash": "^3.0.0",
6170
"source-map": "^0.7.3",
62-
"vue-template-es2015-compiler": "^1.9.1"
71+
"vue-template-babel-compiler": "^1.1.3"
6372
},
6473
"peerDependencies": {
6574
"vite": "^2.0.0-beta.23",
@@ -70,18 +79,18 @@
7079
"@types/debug": "^4.1.7",
7180
"@types/fs-extra": "^9.0.13",
7281
"@types/hash-sum": "^1.0.0",
73-
"@types/jest": "^27.0.2",
82+
"@types/jest": "^27.4.1",
7483
"@types/node": "^16.10.3",
75-
"@types/puppeteer": "^5.4.4",
84+
"@types/puppeteer": "^5.4.5",
7685
"bumpp": "^7.1.1",
7786
"conventional-changelog-cli": "^2.1.1",
7887
"execa": "^4.1.0",
79-
"jest": "^26.6.3",
88+
"jest": "^27.5.1",
8089
"lint-staged": "^10.5.4",
81-
"puppeteer": "^10.4.0",
82-
"ts-jest": "^26.5.6",
83-
"typescript": "^4.4.3",
84-
"vite": "^2.7.10",
90+
"puppeteer": "^13.5.1",
91+
"ts-jest": "^27.1.3",
92+
"typescript": "^4.6.2",
93+
"vite": "^2.8.6",
8594
"vue-template-compiler": "^2.6.14",
8695
"yorkie": "^2.0.0"
8796
}

‎playground/App.vue‎

Lines changed: 15 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -1,16 +1,17 @@
11
<template>
22
<div>
33
<h1>Vite-Plugin-Vue2 Playground</h1>
4-
<TestMultiplySrcImport/>
5-
<TestBlockSrcImport/>
6-
<TestScopedCss/>
7-
<TestCssModules/>
8-
<TestCustomBlock/>
9-
<TestHmr/>
10-
<TestAssets/>
11-
<TestJsx/>
12-
<TestJsxSFC/>
13-
<TestDecorator/>
4+
<TestMultiplySrcImport />
5+
<TestBlockSrcImport />
6+
<TestScopedCss />
7+
<TestCssModules />
8+
<TestCustomBlock />
9+
<TestHmr />
10+
<TestAssets />
11+
<TestJsx />
12+
<TestJsxSFC />
13+
<TestDecorator />
14+
<TestES2020Features />
1415
</div>
1516
</template>
1617

@@ -25,6 +26,7 @@ import TestAssets from './test-assets/TestAssets.vue'
2526
import TestJsx from './TestJsx.tsx'
2627
import TestJsxSFC from './TestJsxSFC.vue'
2728
import TestDecorator from './TestDecorator.tsx'
29+
import TestES2020Features from './TestES2020Features.vue'
2830
2931
export default {
3032
name: 'App',
@@ -38,7 +40,8 @@ export default {
3840
TestAssets,
3941
TestJsx,
4042
TestJsxSFC,
41-
TestDecorator
42-
}
43+
TestDecorator,
44+
TestES2020Features,
45+
},
4346
}
4447
</script>

‎playground/TestES2020Features.vue‎

Lines changed: 47 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,47 @@
1+
<template>
2+
<div>
3+
<h2>ES2020 Features</h2>
4+
<h3>Nullish Coalescing and Optional Chaining</h3>
5+
<code>
6+
[nullish.a.b.c.d ?? 'not found']
7+
<br />
8+
//returns {{ nullish.a.d?.e ?? 'not found' }}
9+
<br />
10+
<br />
11+
[nullish.a.b.c ?? 'not found']
12+
<br />
13+
//returns {{ nullish.a.b.c ?? 'not found' }}
14+
</code>
15+
<h3>Spread Operator</h3>
16+
<code>
17+
["Test", 1, ...('abc').split('')]
18+
<br />
19+
//returns {{ ['Test', 1, ...'abc'.split('')] }}
20+
</code>
21+
</div>
22+
</template>
23+
24+
<script lang="ts">
25+
import Vue from 'vue'
26+
27+
export default Vue.extend({
28+
name: 'TestES2020Features',
29+
30+
data: {
31+
spreadArray: ['s', 'p', 'r', 'ead'],
32+
},
33+
34+
computed: {
35+
nullish() {
36+
return {
37+
a: {
38+
d: undefined as unknown as undefined | { e: string },
39+
b: {
40+
c: '2',
41+
},
42+
},
43+
}
44+
},
45+
},
46+
})
47+
</script>

‎playground/package.json‎

Lines changed: 4 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -9,12 +9,13 @@
99
"serve": "vite preview"
1010
},
1111
"dependencies": {
12-
"vue": "^2.6.11",
12+
"vue": "^2.6.14",
1313
"vue-class-component": "^7.2.6",
1414
"vue-property-decorator": "9.1.2"
1515
},
1616
"devDependencies": {
17-
"vite": "^2.0.0-beta.23",
18-
"vue-template-compiler": "^2.6.12"
17+
"@vue/runtime-dom": "^3.2.31",
18+
"vite": "^2.8.6",
19+
"vue-template-babel-compiler": "^1.1.3"
1920
}
2021
}

‎playground/shims.d.ts‎

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,7 @@
1+
/// <reference types="vite/client" />
2+
3+
declare module '*.vue' {
4+
import Vue from 'vue'
5+
6+
export default Vue
7+
}

‎playground/tsconfig.json‎

Lines changed: 28 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,28 @@
1+
{
2+
"compilerOptions": {
3+
"composite": true,
4+
"target": "ES2019",
5+
"moduleResolution": "node",
6+
"alwaysStrict": true,
7+
"strict": true,
8+
"declaration": true,
9+
"noUnusedLocals": true,
10+
"noEmit": true,
11+
"esModuleInterop": true,
12+
"strictNullChecks": true,
13+
"noUncheckedIndexedAccess": true,
14+
"noImplicitAny": true,
15+
"removeComments": false,
16+
"experimentalDecorators": true,
17+
"module": "ESNext",
18+
"lib": ["esnext", "dom"],
19+
"sourceMap": true
20+
},
21+
"include": ["./"],
22+
"vueCompilerOptions": {
23+
"experimentalCompatMode": 2,
24+
"experimentalTemplateCompilerOptions": {
25+
"compatConfig": { "Mode": 2 }
26+
}
27+
}
28+
}

0 commit comments

Comments
 (0)