Skip to content

Commit 09eb31d

Browse files
kazuponkazupon
authored
fix: vue 3.0.3 compatible (#79)
* fix: vue 3.0.3 compatible * fix: don't hoist
1 parent 26fb593 commit 09eb31d

File tree

11 files changed

+2194
-2263
lines changed

11 files changed

+2194
-2263
lines changed

‎.eslintrc.js

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -26,6 +26,7 @@ module.exports = {
2626
},
2727
rules: {
2828
'object-curly-spacing': 'off',
29+
'@typescript-eslint/ban-types': 'off',
2930
'@typescript-eslint/ban-ts-comment': 'off',
3031
'@typescript-eslint/no-non-null-assertion': 'off',
3132
'@typescript-eslint/explicit-function-return-type': 'off',

‎docs/@intlify/vue-i18n-extensions-api.md

Lines changed: 7 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -15,14 +15,14 @@ Transform `v-t` custom directive
1515

1616
**Signature:**
1717
```typescript
18-
export declare function transformVTDirective(options?: TransformVTDirectiveOptions): DirectiveTransform;
18+
export declare function transformVTDirective<Messages = {}, DateTimeFormats = {}, NumberFormats = {}, Legacy extends boolean = true>(options?: TransformVTDirectiveOptions<Messages, DateTimeFormats, NumberFormats, Legacy>): DirectiveTransform;
1919
```
2020

2121
#### Parameters
2222

2323
| Parameter | Type | Description |
2424
| --- | --- | --- |
25-
| options | TransformVTDirectiveOptions | `v-t` custom directive transform options, see [TransformVTDirectiveOptions](#transformvtdirectiveoptions) |
25+
| options | TransformVTDirectiveOptions&lt;Messages, DateTimeFormats, NumberFormats, Legacy&gt; | `v-t` custom directive transform options, see [TransformVTDirectiveOptions](#transformvtdirectiveoptions) |
2626

2727
#### Returns
2828

@@ -81,7 +81,7 @@ Transform options for `v-t` custom directive
8181

8282
**Signature:**
8383
```typescript
84-
export interface TransformVTDirectiveOptions
84+
export interface TransformVTDirectiveOptions<Messages = {}, DateTimeFormats = {}, NumberFormats = {}, Legacy extends boolean = true>
8585
```
8686

8787

@@ -96,7 +96,7 @@ I18n instance
9696

9797
**Signature:**
9898
```typescript
99-
i18n?: I18n;
99+
i18n?: I18n<Messages, DateTimeFormats, NumberFormats, Legacy>;
100100
```
101101

102102
#### Remarks
@@ -114,7 +114,9 @@ mode?: I18nMode;
114114

115115
#### Remarks
116116

117-
Specify the API style of vue-i18n. If you use legacy API style (e.g. `$t`) at vue-i18n, you need to specify `legacy`. 'composable'
117+
Specify the API style of vue-i18n. If you use legacy API style (e.g. `$t`) at vue-i18n, you need to specify `legacy`.
118+
119+
'composition'
118120

119121

120122

‎package.json

Lines changed: 24 additions & 24 deletions
Original file line numberDiff line numberDiff line change
@@ -25,41 +25,41 @@
2525
},
2626
"dependencies": {
2727
"@babel/parser": "^7.9.6",
28-
"@vue/compiler-dom": "^3.0.2",
29-
"@vue/shared": "^3.0.2",
30-
"vue-i18n": "^9.0.0-beta.6"
28+
"@vue/compiler-dom": "^3.0.5",
29+
"@vue/shared": "^3.0.5",
30+
"vue-i18n": "^9.0.0-rc.5"
3131
},
3232
"devDependencies": {
33-
"@microsoft/api-extractor": "^7.9.3",
34-
"@types/jest": "^26.0.0",
35-
"@types/node": "^13.1.4",
33+
"@microsoft/api-extractor": "^7.12.0",
34+
"@types/jest": "^26.0.14",
35+
"@types/node": "^14.14.0",
3636
"@types/webpack": "^4.41.1",
3737
"@types/webpack-merge": "^4.1.5",
38-
"@typescript-eslint/eslint-plugin": "^4.7.0",
39-
"@typescript-eslint/parser": "^4.7.0",
40-
"@vue/compiler-sfc": "^3.0.2",
41-
"@vue/compiler-ssr": "^3.0.2",
42-
"@vue/runtime-dom": "^3.0.2",
43-
"@vue/server-renderer": "^3.0.2",
44-
"api-docs-gen": "^0.2.0",
38+
"@typescript-eslint/eslint-plugin": "^4.9.0",
39+
"@typescript-eslint/parser": "^4.9.0",
40+
"@vue/compiler-sfc": "^3.0.5",
41+
"@vue/compiler-ssr": "^3.0.5",
42+
"@vue/runtime-dom": "^3.0.5",
43+
"@vue/server-renderer": "^3.0.5",
44+
"api-docs-gen": "^0.2.6",
4545
"babel-loader": "^8.1.0",
46-
"eslint": "^7.13.0",
47-
"eslint-config-prettier": "^6.10.1",
48-
"eslint-plugin-prettier": "^3.1.2",
46+
"eslint": "^7.19.0",
47+
"eslint-config-prettier": "^7.2.0",
48+
"eslint-plugin-prettier": "^3.3.0",
4949
"eslint-plugin-vue-libs": "^4.0.0",
50-
"jest": "^26.0.0",
50+
"jest": "^26.4.2",
5151
"jest-puppeteer": "^4.4.0",
5252
"jest-watch-typeahead": "^0.6.0",
5353
"lerna-changelog": "^1.0.0",
5454
"npm-run-all": "^4.1.5",
5555
"opener": "^1.5.1",
5656
"puppeteer": "^2.1.1",
5757
"shipjs": "^0.23.0",
58-
"ts-jest": "^26.0.0",
59-
"typescript": "^4.0.3",
60-
"typescript-eslint-language-service": "^4.1.1",
61-
"vue": "^3.0.2",
62-
"vue-loader": "^16.0.0-rc.1",
58+
"ts-jest": "^26.4.0",
59+
"typescript": "^4.1.3",
60+
"typescript-eslint-language-service": "^4.1.3",
61+
"vue": "^3.0.5",
62+
"vue-loader": "^16.1.2",
6363
"webpack": "^4.42.1",
6464
"webpack-cli": "^3.3.11",
6565
"webpack-dev-server": "^3.10.3",
@@ -84,15 +84,15 @@
8484
"license": "MIT",
8585
"main": "lib/index.js",
8686
"peerDependencies": {
87-
"vue": "^3.0.0-rc.12"
87+
"vue": "^3.0.5"
8888
},
8989
"types": "dist/vue-i18n-extensions.d.ts",
9090
"repository": {
9191
"type": "git",
9292
"url": "git+https://github.com/intlify/vue-i18n-extensions.git"
9393
},
9494
"scripts": {
95-
"build": "yarn build:transpile && yarn build:extract",
95+
"build": "yarn build:transpile && yarn build:extract && yarn build:docs",
9696
"build:transpile": "tsc -p .",
9797
"build:extract": "api-extractor run -l -c ./api-extractor.json",
9898
"build:docs": "api-docs-gen ./temp/vue-i18n-extensions.api.json -c ./docsgen.config.js -o ./docs",

‎src/transform.ts

Lines changed: 66 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -37,7 +37,12 @@ type VTDirectiveValue = {
3737
*
3838
* @public
3939
*/
40-
export interface TransformVTDirectiveOptions {
40+
export interface TransformVTDirectiveOptions<
41+
Messages = {},
42+
DateTimeFormats = {},
43+
NumberFormats = {},
44+
Legacy extends boolean = true
45+
> {
4146
/**
4247
* I18n instance
4348
*
@@ -46,18 +51,27 @@ export interface TransformVTDirectiveOptions {
4651
* The translation will use the global resources registered in the I18n instance,
4752
* that is, `v-t` diretive transform is also a limitation that the resources of each component cannot be used.
4853
*/
49-
i18n?: I18n
54+
i18n?: I18n<Messages, DateTimeFormats, NumberFormats, Legacy>
5055
/**
5156
* I18n Mode
5257
*
5358
* @remarks
5459
* Specify the API style of vue-i18n. If you use legacy API style (e.g. `$t`) at vue-i18n, you need to specify `legacy`.
5560
*
56-
* @default 'composable'
61+
* @default 'composition'
5762
*/
5863
mode?: I18nMode
5964
}
6065

66+
// compatibility for this commit(v3.0.3)
67+
// https://github.com/vuejs/vue-next/commit/90bdf59f4c84ec0af9bab402c37090d82806cfc1
68+
const enum ConstantTypes {
69+
NOT_CONSTANT = 0,
70+
CAN_SKIP_PATCH,
71+
CAN_HOIST,
72+
CAN_STRINGIFY
73+
}
74+
6175
/**
6276
* Transform `v-t` custom directive
6377
*
@@ -106,14 +120,24 @@ export interface TransformVTDirectiveOptions {
106120
* ```
107121
* @public
108122
*/
109-
export function transformVTDirective(
110-
options: TransformVTDirectiveOptions = {}
123+
export function transformVTDirective<
124+
Messages = {},
125+
DateTimeFormats = {},
126+
NumberFormats = {},
127+
Legacy extends boolean = true
128+
>(
129+
options: TransformVTDirectiveOptions<
130+
Messages,
131+
DateTimeFormats,
132+
NumberFormats,
133+
Legacy
134+
> = {}
111135
): DirectiveTransform {
112136
const i18nInstance = options.i18n
113137
const mode =
114-
isString(options.mode) && ['composable', 'legacy'].includes(options.mode)
138+
isString(options.mode) && ['composition', 'legacy'].includes(options.mode)
115139
? options.mode
116-
: 'composable'
140+
: 'composition'
117141

118142
return (dir, node, context) => {
119143
const { exp, loc } = dir
@@ -150,7 +174,7 @@ export function transformVTDirective(
150174
}
151175

152176
if (isSimpleExpressionNode(exp)) {
153-
if (exp.isConstant && i18nInstance) {
177+
if (isConstant(exp) && i18nInstance) {
154178
const { status, value } = evaluateValue(exp.content)
155179
if (status === 'ng') {
156180
report(ReportCodes.FAILED_VALUE_EVALUATION, {
@@ -166,7 +190,12 @@ export function transformVTDirective(
166190
return { props: [] }
167191
}
168192

169-
const content = i18nInstance.global.t(...makeParams(parsedValue!))
193+
const global =
194+
i18nInstance.mode === 'composition'
195+
? (i18nInstance.global as any) // eslint-disable-line @typescript-eslint/no-explicit-any
196+
: (i18nInstance.global as any).__composer // eslint-disable-line @typescript-eslint/no-explicit-any
197+
const content = global.t(...makeParams(parsedValue!))
198+
170199
node.children.push({
171200
type: NodeTypes.TEXT,
172201
content
@@ -179,7 +208,13 @@ export function transformVTDirective(
179208
node.children.push({
180209
type: NodeTypes.INTERPOLATION,
181210
content: createCompoundExpression([
182-
createSimpleExpression(code, false, loc)
211+
createSimpleExpression(
212+
code,
213+
false,
214+
loc,
215+
// eslint-disable-next-line @typescript-eslint/no-explicit-any
216+
ConstantTypes.NOT_CONSTANT as any
217+
)
183218
])
184219
} as InterpolationNode)
185220
return { props: [] }
@@ -195,7 +230,13 @@ export function transformVTDirective(
195230
node.children.push({
196231
type: NodeTypes.INTERPOLATION,
197232
content: createCompoundExpression([
198-
createSimpleExpression(code, false, loc)
233+
createSimpleExpression(
234+
code,
235+
false,
236+
loc,
237+
// eslint-disable-next-line @typescript-eslint/no-explicit-any
238+
ConstantTypes.NOT_CONSTANT as any
239+
)
199240
])
200241
} as InterpolationNode)
201242
return { props: [] }
@@ -221,6 +262,19 @@ function isCompoundExpressionNode(
221262
return node != null && node.type === NodeTypes.COMPOUND_EXPRESSION
222263
}
223264

265+
function isConstant(node: SimpleExpressionNode): boolean {
266+
if ('isConstant' in node) {
267+
// for v3.0.3 earlier
268+
// eslint-disable-next-line @typescript-eslint/no-explicit-any
269+
return (node as any).isConstant
270+
} else if ('constType' in node) {
271+
// for v3.0.3 or later
272+
return (node.constType as number) <= ConstantTypes.CAN_STRINGIFY
273+
} else {
274+
throw Error('unexpected error')
275+
}
276+
}
277+
224278
function mapNodeContentHanlder(
225279
value:
226280
| string
@@ -292,7 +346,7 @@ function generateTranslationCode(
292346
mode: I18nMode,
293347
params: TranslationParams
294348
): string {
295-
return mode === 'composable'
349+
return mode === 'composition'
296350
? generateComposableCode(context, params)
297351
: generateLegacyCode(context, params)
298352
}

‎test/__snapshots__/pre-translation.test.ts.snap

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -65,9 +65,9 @@ Object {
6565
Object {
6666
"arg": undefined,
6767
"exp": Object {
68+
"constType": 3,
6869
"content": "'hello'",
6970
"identifiers": Array [],
70-
"isConstant": true,
7171
"isStatic": false,
7272
"loc": Object {
7373
"end": Object {
@@ -226,9 +226,9 @@ Object {
226226
Object {
227227
"arg": undefined,
228228
"exp": Object {
229+
"constType": 0,
229230
"content": "'foo.bar'",
230231
"identifiers": Array [],
231-
"isConstant": true,
232232
"isStatic": false,
233233
"loc": Object {
234234
"end": Object {
@@ -387,9 +387,9 @@ Object {
387387
Object {
388388
"arg": undefined,
389389
"exp": Object {
390+
"constType": 3,
390391
"content": "{ path: 'hello', locale: 'ja', args: { name: 'kazupon' } }",
391392
"identifiers": Array [],
392-
"isConstant": true,
393393
"isStatic": false,
394394
"loc": Object {
395395
"end": Object {
@@ -548,9 +548,9 @@ Object {
548548
Object {
549549
"arg": undefined,
550550
"exp": Object {
551+
"constType": 3,
551552
"content": "{ path: 'banana', choice: 2 }",
552553
"identifiers": Array [],
553-
"isConstant": true,
554554
"isStatic": false,
555555
"loc": Object {
556556
"end": Object {

0 commit comments

Comments
 (0)