From c436d867e7f52fa7b8af09151c6750787fc4ab91 Mon Sep 17 00:00:00 2001 From: kazuya kawaguchi Date: Tue, 14 May 2024 16:29:02 +0900 Subject: [PATCH] feat!: default enable for JIT compilation --- docs/guide/advanced/optimization.md | 36 +++++++------ docs/guide/migration/breaking10.md | 16 ++++++ packages/core-base/src/compilation.ts | 50 +------------------ packages/core-base/src/misc.ts | 4 -- packages/core-base/test/compilation.test.ts | 26 +--------- packages/core-base/test/datetime.test.ts | 4 +- packages/core-base/test/devtools.test.ts | 6 +-- packages/core-base/test/number.test.ts | 4 +- packages/core-base/test/translate.test.ts | 6 +-- packages/core/src/index.ts | 17 +------ packages/core/src/runtime.ts | 4 +- packages/global.d.ts | 1 - packages/petite-vue-i18n/src/index.ts | 12 +---- packages/petite-vue-i18n/src/runtime.ts | 4 +- packages/size-check-core/vite.config.ts | 1 - .../size-check-petite-vue-i18n/vite.config.ts | 1 - packages/size-check-vue-i18n/vite.config.ts | 1 - packages/vue-i18n-core/src/misc.ts | 4 -- .../test/components/DatetimeFormat.test.ts | 4 +- .../test/components/NumberFormat.test.ts | 4 +- .../test/components/Translation.test.ts | 4 +- packages/vue-i18n-core/test/composer.test.ts | 5 +- packages/vue-i18n-core/test/directive.test.ts | 4 +- packages/vue-i18n-core/test/diretive.test.ts | 5 +- packages/vue-i18n-core/test/i18n.test.ts | 4 +- packages/vue-i18n-core/test/issues.test.ts | 4 +- packages/vue-i18n-core/test/legacy.test.ts | 4 +- packages/vue-i18n-core/test/mixin.test.ts | 4 +- packages/vue-i18n-core/test/ssr.test.ts | 4 +- packages/vue-i18n-core/test/wc.test.ts | 4 +- packages/vue-i18n/README.md | 11 ++-- packages/vue-i18n/src/index.ts | 12 +---- packages/vue-i18n/src/runtime.ts | 4 +- rollup.config.mjs | 3 -- vitest.config.ts | 1 - 35 files changed, 81 insertions(+), 197 deletions(-) diff --git a/docs/guide/advanced/optimization.md b/docs/guide/advanced/optimization.md index 09f490c07..c73db2fd7 100644 --- a/docs/guide/advanced/optimization.md +++ b/docs/guide/advanced/optimization.md @@ -3,31 +3,33 @@ ## Performance -As described in "[installation](../installation##from-cdn-or-without-a-bundler)" section, Vue I18n offer the following two built ES modules for Bundler. +As described in "[Different Distribution files](../extra/dist##from-cdn-or-without-a-bundler)" section, Vue I18n offer the following two built ES modules for Bundler. - message compiler + runtime: **`vue-i18n.esm-bundler.js`** - runtime only: **`vue-i18n.runtime.esm-bundler.js`** -For bundler, it’s configured to bundle `vue-i18n.esm-bundler.js` with [`@intlify/bundle-tools`](https://github.com/intlify/bundle-tools#intlifybundle-tools) as default. If you want to reduce the bundle size further, you can configure the bundler to use `vue-i18n.runtime.esm-bundler.js`, which is runtime only. +For bundler, it’s configured to bundle `vue-i18n.esm-bundler.js` with [`@intlify/unplugin-vue-i18n`](https://github.com/intlify/bundle-tools/tree/main/packages/unplugin-vue-i18n) as default. If you want to reduce the bundle size further, you can configure the bundler to use `vue-i18n.runtime.esm-bundler.js`, which is runtime only. -:::danger NOTE -IF [CSP](https://developer.mozilla.org/en-US/docs/Web/HTTP/CSP) is enabled, `vue-i18n.esm-bundler.js` would not work with compiler due to `eval` statements. These statements violate the `default-src 'self'` header. Instead you need to use `vue-i18n.runtime.esm-bundler.js`. -::: +The use of ES Module `vue-i18n.runtime.esm-bundler.js` means that **all locale messages have to pre-compile to Message functions or AST resources**. what this means it improves performance because vue-i18n just only execute Message functions, so no compilation. -:::warning NOTICE -From v9.3, the CSP issue can be worked around by JIT compilation of the vue-i18n message compiler. See [JIT compilation for details](#jit-compilation). +:::tip NOTE +Before v9.3, the locale messages will be compiled to Message functions, after v9.3 or later these will be compiled to AST with `@intlify/bundle-tools`. ::: -The use of this ES Module means that **all locale messages have to pre-compile to Message functions**. what this means it improves performance because vue-i18n just only execute Message functions, so no compilation. - -Also, the message compiler is not bundled, therefore **bundle size can be reduced** +:::tip NOTE +Before v9.3, all locale messages are compiled with `@intlify/unplugin-vue-i18n`, so the message compiler is not bundled, **bundle size can be reduced**. -:::warning NOTICE -If you are using the JIT compilation, all locale messages will not necessarily be compiled with the Message function. +After v9.3, since the message compiler is also bundled, the bundle size cannot be reduced. **This is a trade-off**. +About the reason, See [JIT compilation for details](#jit-compilation). +::: -Also, since the message compiler is also bundled, the bundle size cannot be reduced. **This is a trade-off**. +:::danger NOTE +If [CSP](https://developer.mozilla.org/en-US/docs/Web/HTTP/CSP) is enabled in before v9.3, `vue-i18n.esm-bundler.js` would not work with compiler due to `eval` statements. These statements violate the `default-src 'self'` header. Instead you need to use `vue-i18n.runtime.esm-bundler.js`. ::: +:::warning NOTICE +From v9.3, the CSP issue can be worked around by JIT compilation of the vue-i18n message compiler. See [JIT compilation for details](#jit-compilation). +::: ## How to configure @@ -132,14 +134,14 @@ About how to configure for bundler, see the [here](#configure-feature-flags-for- :new: 9.3+ ::: -Before v9.3, vue-i18n message compiler precompiled locale messages like AOT. +Before v9.3, vue-i18n message compiler precompiled locale messages like AOT (Ahead Of Time). However, it had the following issues: - CSP issues: hard to work on service/web workers, edge-side runtimes of CDNs and etc. - Back-end integration: hard to get messages from back-end such as database via API and localize them dynamically -To solve these issues, JIT style compilation is supported message compiler. +To solve these issues, JIT (Just In Time) style compilation is supported message compiler. Each time localization is performed in an application using `$t` or `t` functions, message resources will be compiled on message compiler. @@ -152,6 +154,10 @@ You need to configure the following feature flag with `esm-bundler` build and bu This feature is opted out as default, because compatibility with previous version before v9.3. ::: +:::warning NOTICE +From v10, JIT compilation is enabled by default, so it is no longer necessary to set the `__INTLIFY_JIT_COMPILATION__` flag in the bundler. +::: + About how to configure for bundler, see the [here](#configure-feature-flags-for-bundler). diff --git a/docs/guide/migration/breaking10.md b/docs/guide/migration/breaking10.md index 3bb180d44..11fcf2f67 100644 --- a/docs/guide/migration/breaking10.md +++ b/docs/guide/migration/breaking10.md @@ -4,6 +4,22 @@ Vue I18n v10 **is still an alpha version**. ::: +## Default enable for JIT compilation + +**Reason**: CSP problems can be solved and dynamic resources can be supported + +JIT compilation was introduced in v9.3. It was not enabled by default. + +Nuxt I18n, which integrates vue-i18n, already has this feature enabled and stable by default. +https://i18n.nuxtjs.org/docs/options/compilation#jit + +To use this feature in Vue I18n, we had to use bundler and `@intlify/unplugin-vue-i18n` to enable the `__INTLIFY_JIT_COMPILATION__` flag. +By default in the JIT compilation, this flag is no longer needed starting with v10. + +If you would not still using the JIT compilation and would be moving up to v10 or later, **you will need to rebuild your application once**. + +About JIT compilation details, See "[Optimazation](../advanced/optimization.md)". + ## Change `$t` and `t` overloaded signature for Legacy API mode In Vue I18n v9, it has a different interface from the Composition API mode and Legacy API mode of `$t` and `t` overloaded signature. diff --git a/packages/core-base/src/compilation.ts b/packages/core-base/src/compilation.ts index 79e4b1354..010718538 100644 --- a/packages/core-base/src/compilation.ts +++ b/packages/core-base/src/compilation.ts @@ -5,7 +5,6 @@ import { detectHtmlTag } from '@intlify/message-compiler' import { format as formatMessage } from './format' -import { CoreErrorCodes, createCoreError } from './errors' import type { CompileOptions, @@ -53,53 +52,6 @@ function baseCompile( } /* #__NO_SIDE_EFFECTS__ */ -export const compileToFunction = < - Message = string, - MessageSource = string | ResourceNode ->( - message: MessageSource, - context: MessageCompilerContext -): MessageFunction => { - if (!isString(message)) { - throw createCoreError(CoreErrorCodes.NOT_SUPPORT_NON_STRING_MESSAGE) - } - - if (__RUNTIME__) { - __DEV__ && - warn( - `Runtime compilation is not supported in ${ - __BUNDLE_FILENAME__ || 'N/A' - }.` - ) - return (() => message) as MessageFunction - } else { - // check HTML message - const warnHtmlMessage = isBoolean(context.warnHtmlMessage) - ? context.warnHtmlMessage - : true - __DEV__ && checkHtmlMessage(message, warnHtmlMessage) - - // check caches - const onCacheKey = context.onCacheKey || defaultOnCacheKey - const cacheKey = onCacheKey(message) - const cached = (compileCache as MessageFunctions)[cacheKey] - if (cached) { - return cached - } - - // compile - const { code, detectError } = baseCompile(message, context) - - // evaluate function - const msg = new Function(`return ${code}`)() as MessageFunction - - // if occurred compile error, don't cache - return !detectError - ? ((compileCache as MessageFunctions)[cacheKey] = msg) - : msg - } -} - export function compile< Message = string, MessageSource = string | ResourceNode @@ -111,7 +63,7 @@ export function compile< (__ESM_BROWSER__ || __NODE_JS__ || __GLOBAL__ || - (__FEATURE_JIT_COMPILATION__ && !__FEATURE_DROP_MESSAGE_COMPILER__)) && + !__FEATURE_DROP_MESSAGE_COMPILER__) && isString(message) ) { // check HTML message diff --git a/packages/core-base/src/misc.ts b/packages/core-base/src/misc.ts index 88d9290d4..e17b7c441 100644 --- a/packages/core-base/src/misc.ts +++ b/packages/core-base/src/misc.ts @@ -9,10 +9,6 @@ export function initFeatureFlags(): void { getGlobalThis().__INTLIFY_PROD_DEVTOOLS__ = false } - if (typeof __FEATURE_JIT_COMPILATION__ !== 'boolean') { - getGlobalThis().__INTLIFY_JIT_COMPILATION__ = false - } - if (typeof __FEATURE_DROP_MESSAGE_COMPILER__ !== 'boolean') { getGlobalThis().__INTLIFY_DROP_MESSAGE_COMPILER__ = false } diff --git a/packages/core-base/test/compilation.test.ts b/packages/core-base/test/compilation.test.ts index c104835ea..abf2d90a5 100644 --- a/packages/core-base/test/compilation.test.ts +++ b/packages/core-base/test/compilation.test.ts @@ -9,12 +9,7 @@ vi.mock('@intlify/shared', async () => { }) import { baseCompile } from '@intlify/message-compiler' -import { - compileToFunction, - compile, - isMessageAST, - clearCompileCache -} from '../src/compilation' +import { compile, isMessageAST, clearCompileCache } from '../src/compilation' import { createMessageContext as context } from '../src/runtime' const DEFAULT_CONTEXT = { locale: 'en', key: 'key' } @@ -43,25 +38,6 @@ describe('isMessageAST', () => { }) }) -describe('compileToFunction', () => { - test('basic', () => { - const msg = compileToFunction('hello {name}!', DEFAULT_CONTEXT) - const ctx = context({ - named: { name: 'kazupon' } - }) - expect(msg(ctx)).toBe('hello kazupon!') - }) - - test('error', () => { - let occured = false - compileToFunction('hello {name!', { - ...DEFAULT_CONTEXT, - onError: () => (occured = true) - }) - expect(occured).toBe(true) - }) -}) - describe('compile', () => { test('basic', () => { const msg = compile('hello {name}!', DEFAULT_CONTEXT) diff --git a/packages/core-base/test/datetime.test.ts b/packages/core-base/test/datetime.test.ts index b7b8c64e2..1190f0d5a 100644 --- a/packages/core-base/test/datetime.test.ts +++ b/packages/core-base/test/datetime.test.ts @@ -27,7 +27,7 @@ import { registerMessageCompiler, registerLocaleFallbacker } from '../src/context' -import { compileToFunction } from '../src/compilation' +import { compile } from '../src/compilation' import { fallbackWithLocaleChain } from '../src/fallbacker' import type { DateTimeFormats } from '../src/types' @@ -86,7 +86,7 @@ const dts = [ ] beforeEach(() => { - registerMessageCompiler(compileToFunction) + registerMessageCompiler(compile) registerLocaleFallbacker(fallbackWithLocaleChain) }) diff --git a/packages/core-base/test/devtools.test.ts b/packages/core-base/test/devtools.test.ts index dad4dc5ba..7fdabed92 100644 --- a/packages/core-base/test/devtools.test.ts +++ b/packages/core-base/test/devtools.test.ts @@ -1,6 +1,6 @@ import { createEmitter } from '@intlify/shared' import { createCoreContext, translate } from '../src/index' -import { compileToFunction } from '../src/compilation' +import { compile } from '../src/compilation' import { setDevToolsHook, getDevToolsHook } from '../src/devtools' import type { @@ -51,7 +51,7 @@ describe('translateDevTools', () => { const HELLO = 'Hello {name}!' const ctx = createCoreContext({ locale: 'en', - messageCompiler: compileToFunction, + messageCompiler: compile, messages: { en: { hello: HELLO @@ -78,7 +78,7 @@ describe('translateDevTools', () => { const ctx = createCoreContext({ locale: 'en', fallbackLocale: ['ja'], - messageCompiler: compileToFunction, + messageCompiler: compile, messages: { ja: { hello: HELLO diff --git a/packages/core-base/test/number.test.ts b/packages/core-base/test/number.test.ts index 7e437c8e9..8fb7207e5 100644 --- a/packages/core-base/test/number.test.ts +++ b/packages/core-base/test/number.test.ts @@ -27,7 +27,7 @@ import { registerMessageCompiler, registerLocaleFallbacker } from '../src/context' -import { compileToFunction } from '../src/compilation' +import { compile } from '../src/compilation' import { fallbackWithLocaleChain } from '../src/fallbacker' import { NumberFormats } from '../src/types/index' @@ -69,7 +69,7 @@ const numberFormats: NumberFormats = { } beforeEach(() => { - registerMessageCompiler(compileToFunction) + registerMessageCompiler(compile) registerLocaleFallbacker(fallbackWithLocaleChain) }) diff --git a/packages/core-base/test/translate.test.ts b/packages/core-base/test/translate.test.ts index 222032d95..ea0956d0f 100644 --- a/packages/core-base/test/translate.test.ts +++ b/packages/core-base/test/translate.test.ts @@ -20,7 +20,7 @@ import { registerMessageResolver, registerLocaleFallbacker } from '../src/context' -import { compileToFunction, compile } from '../src/compilation' +import { compile } from '../src/compilation' import { fallbackWithLocaleChain } from '../src/fallbacker' import { resolveValue } from '../src/resolver' import { createTextNode } from './helper' @@ -31,7 +31,7 @@ import type { MessageType, MessageProcessor } from '../src/runtime' import type { PickupKeys } from '../src/types/utils' beforeEach(() => { - registerMessageCompiler(compileToFunction) + registerMessageCompiler(compile) registerMessageResolver(resolveValue) registerLocaleFallbacker(fallbackWithLocaleChain) }) @@ -978,8 +978,6 @@ describe('processor', () => { describe('AST passing', () => { test('simple text', () => { - registerMessageCompiler(compile) - const msg = 'hi kazupon !' const { ast } = baseCompile(msg, { jit: true, location: false }) diff --git a/packages/core/src/index.ts b/packages/core/src/index.ts index 9b2fd7a49..04bc18da2 100644 --- a/packages/core/src/index.ts +++ b/packages/core/src/index.ts @@ -1,6 +1,5 @@ import { registerMessageCompiler, - compileToFunction, compile, registerMessageResolver, resolveValue, @@ -8,27 +7,13 @@ import { fallbackWithLocaleChain } from '@intlify/core-base' import { initFeatureFlags } from '../../core-base/src/misc' -import { getGlobalThis } from '@intlify/shared' if (__ESM_BUNDLER__ && !__TEST__) { initFeatureFlags() - if (__NODE_JS__) { - // avoid Node.js CSP for Function() - getGlobalThis().__INTLIFY_JIT_COMPILATION__ = true - } } // register message compiler at @intlify/core -if ( - __ESM_BROWSER__ || - __NODE_JS__ || - __GLOBAL__ || - __FEATURE_JIT_COMPILATION__ -) { - registerMessageCompiler(compile) -} else { - registerMessageCompiler(compileToFunction) -} +registerMessageCompiler(compile) // register message resolver at @intlify/core registerMessageResolver(resolveValue) diff --git a/packages/core/src/runtime.ts b/packages/core/src/runtime.ts index 81d7d7dba..82021e26d 100644 --- a/packages/core/src/runtime.ts +++ b/packages/core/src/runtime.ts @@ -13,9 +13,7 @@ if (__ESM_BUNDLER__ && !__TEST__) { } // register message compiler for jit compilation -if (__FEATURE_JIT_COMPILATION__) { - registerMessageCompiler(compile) -} +registerMessageCompiler(compile) // register message resolver at @intlify/core registerMessageResolver(resolveValue) diff --git a/packages/global.d.ts b/packages/global.d.ts index d68cdb4eb..441f998ec 100644 --- a/packages/global.d.ts +++ b/packages/global.d.ts @@ -17,5 +17,4 @@ declare let __FEATURE_PROD_VUE_DEVTOOLS__: boolean declare let __FEATURE_PROD_INTLIFY_DEVTOOLS__: boolean declare let __FEATURE_LEGACY_API__: boolean declare let __FEATURE_FULL_INSTALL__: boolean -declare let __FEATURE_JIT_COMPILATION__: boolean declare let __FEATURE_DROP_MESSAGE_COMPILER__: boolean diff --git a/packages/petite-vue-i18n/src/index.ts b/packages/petite-vue-i18n/src/index.ts index 83de93bd2..7002ce033 100644 --- a/packages/petite-vue-i18n/src/index.ts +++ b/packages/petite-vue-i18n/src/index.ts @@ -2,7 +2,6 @@ import { getGlobalThis } from '@intlify/shared' import { setDevToolsHook, registerMessageCompiler, - compileToFunction, compile } from '@intlify/core-base' import { initDev, initFeatureFlags } from '../../vue-i18n-core/src/misc' @@ -12,16 +11,7 @@ if (__ESM_BUNDLER__ && !__TEST__) { } // register message compiler at petite-vue-i18n -if ( - __ESM_BROWSER__ || - __NODE_JS__ || - __GLOBAL__ || - __FEATURE_JIT_COMPILATION__ -) { - registerMessageCompiler(compile) -} else { - registerMessageCompiler(compileToFunction) -} +registerMessageCompiler(compile) export { Path, diff --git a/packages/petite-vue-i18n/src/runtime.ts b/packages/petite-vue-i18n/src/runtime.ts index 3f624402d..235596f11 100644 --- a/packages/petite-vue-i18n/src/runtime.ts +++ b/packages/petite-vue-i18n/src/runtime.ts @@ -11,9 +11,7 @@ if (__ESM_BUNDLER__ && !__TEST__) { } // register message compiler for jit compilation -if (__FEATURE_JIT_COMPILATION__) { - registerMessageCompiler(compile) -} +registerMessageCompiler(compile) export { Path, diff --git a/packages/size-check-core/vite.config.ts b/packages/size-check-core/vite.config.ts index 19bb449dd..be226786b 100644 --- a/packages/size-check-core/vite.config.ts +++ b/packages/size-check-core/vite.config.ts @@ -13,7 +13,6 @@ export default defineConfig({ __RUNTIME__: true, // is targeting Node (SSR)? __NODE_JS__: false, - __INTLIFY_JIT_COMPILATION__: false, __INTLIFY_DROP_MESSAGE_COMPILER__: false, __INTLIFY_PROD_DEVTOOLS__: false, 'process.env.NODE_ENV': JSON.stringify('production') diff --git a/packages/size-check-petite-vue-i18n/vite.config.ts b/packages/size-check-petite-vue-i18n/vite.config.ts index cb950118e..0647429df 100644 --- a/packages/size-check-petite-vue-i18n/vite.config.ts +++ b/packages/size-check-petite-vue-i18n/vite.config.ts @@ -18,7 +18,6 @@ export default defineConfig({ __VUE_I18N_LEGACY_API__: false, __VUE_I18N_FULL_INSTALL__: false, __VUE_PROD_DEVTOOLS__: false, - __INTLIFY_JIT_COMPILATION__: true, __INTLIFY_DROP_MESSAGE_COMPILER__: true, __INTLIFY_PROD_DEVTOOLS__: false, 'process.env.NODE_ENV': JSON.stringify('production') diff --git a/packages/size-check-vue-i18n/vite.config.ts b/packages/size-check-vue-i18n/vite.config.ts index 0eee88ac3..878a6dcd6 100644 --- a/packages/size-check-vue-i18n/vite.config.ts +++ b/packages/size-check-vue-i18n/vite.config.ts @@ -18,7 +18,6 @@ export default defineConfig({ __VUE_I18N_LEGACY_API__: false, __VUE_I18N_FULL_INSTALL__: false, __VUE_PROD_DEVTOOLS__: false, - __INTLIFY_JIT_COMPILATION__: true, __INTLIFY_DROP_MESSAGE_COMPILER__: true, __INTLIFY_PROD_DEVTOOLS__: false, 'process.env.NODE_ENV': JSON.stringify('production') diff --git a/packages/vue-i18n-core/src/misc.ts b/packages/vue-i18n-core/src/misc.ts index 3a2d49e05..fb4af9b94 100644 --- a/packages/vue-i18n-core/src/misc.ts +++ b/packages/vue-i18n-core/src/misc.ts @@ -23,10 +23,6 @@ export function initFeatureFlags(): void { getGlobalThis().__VUE_I18N_LEGACY_API__ = true } - if (typeof __FEATURE_JIT_COMPILATION__ !== 'boolean') { - getGlobalThis().__INTLIFY_JIT_COMPILATION__ = false - } - if (typeof __FEATURE_DROP_MESSAGE_COMPILER__ !== 'boolean') { getGlobalThis().__INTLIFY_DROP_MESSAGE_COMPILER__ = false } diff --git a/packages/vue-i18n-core/test/components/DatetimeFormat.test.ts b/packages/vue-i18n-core/test/components/DatetimeFormat.test.ts index 885512ee8..a24be8729 100644 --- a/packages/vue-i18n-core/test/components/DatetimeFormat.test.ts +++ b/packages/vue-i18n-core/test/components/DatetimeFormat.test.ts @@ -5,7 +5,7 @@ import { mount } from '../helper' import { defineComponent, SetupContext, VNodeChild, h } from 'vue' import { - compileToFunction, + compile, registerMessageCompiler, resolveValue, registerMessageResolver, @@ -42,7 +42,7 @@ const datetimeFormats: IntlDateTimeFormats = { } beforeAll(() => { - registerMessageCompiler(compileToFunction) + registerMessageCompiler(compile) registerMessageResolver(resolveValue) registerLocaleFallbacker(fallbackWithLocaleChain) }) diff --git a/packages/vue-i18n-core/test/components/NumberFormat.test.ts b/packages/vue-i18n-core/test/components/NumberFormat.test.ts index edf87e5aa..ff4d9b3d3 100644 --- a/packages/vue-i18n-core/test/components/NumberFormat.test.ts +++ b/packages/vue-i18n-core/test/components/NumberFormat.test.ts @@ -5,7 +5,7 @@ import { mount } from '../helper' import { defineComponent, SetupContext, VNodeChild, h } from 'vue' import { - compileToFunction, + compile, registerMessageCompiler, resolveValue, registerMessageResolver, @@ -44,7 +44,7 @@ const numberFormats = { } beforeAll(() => { - registerMessageCompiler(compileToFunction) + registerMessageCompiler(compile) registerMessageResolver(resolveValue) registerLocaleFallbacker(fallbackWithLocaleChain) }) diff --git a/packages/vue-i18n-core/test/components/Translation.test.ts b/packages/vue-i18n-core/test/components/Translation.test.ts index 319a1e544..3e3b48cdf 100644 --- a/packages/vue-i18n-core/test/components/Translation.test.ts +++ b/packages/vue-i18n-core/test/components/Translation.test.ts @@ -12,7 +12,7 @@ import { nextTick } from 'vue' import { - compileToFunction, + compile, registerMessageCompiler, resolveValue, registerMessageResolver, @@ -47,7 +47,7 @@ const messages = { } beforeAll(() => { - registerMessageCompiler(compileToFunction) + registerMessageCompiler(compile) registerMessageResolver(resolveValue) registerLocaleFallbacker(fallbackWithLocaleChain) }) diff --git a/packages/vue-i18n-core/test/composer.test.ts b/packages/vue-i18n-core/test/composer.test.ts index 7b31bb91d..d7f6de547 100644 --- a/packages/vue-i18n-core/test/composer.test.ts +++ b/packages/vue-i18n-core/test/composer.test.ts @@ -29,7 +29,6 @@ import { getWarnMessage, I18nWarnCodes } from '../src/warnings' import { watch, watchEffect, nextTick, Text, createVNode } from 'vue' import { Locale, - compileToFunction, compile, registerMessageCompiler, resolveValue, @@ -43,7 +42,7 @@ import { } from '@intlify/core-base' beforeEach(() => { - registerMessageCompiler(compileToFunction) + registerMessageCompiler(compile) registerMessageResolver(resolveValue) registerLocaleFallbacker(fallbackWithLocaleChain) }) @@ -799,8 +798,6 @@ describe('rt', () => { }) test('AST', () => { - registerMessageCompiler(compile) - const { rt, messages } = createComposer({ locale: 'en', messages: { diff --git a/packages/vue-i18n-core/test/directive.test.ts b/packages/vue-i18n-core/test/directive.test.ts index 171e8e220..44ca503d6 100644 --- a/packages/vue-i18n-core/test/directive.test.ts +++ b/packages/vue-i18n-core/test/directive.test.ts @@ -19,7 +19,7 @@ import { mount } from './helper' import { defineComponent, ref, h, withDirectives, resolveDirective } from 'vue' import { format } from '@intlify/shared' import { - compileToFunction, + compile, registerMessageCompiler, resolveValue, registerMessageResolver, @@ -30,7 +30,7 @@ import { createI18n } from '../src/index' import { errorMessages, I18nErrorCodes } from '../src/errors' beforeAll(() => { - registerMessageCompiler(compileToFunction) + registerMessageCompiler(compile) registerMessageResolver(resolveValue) registerLocaleFallbacker(fallbackWithLocaleChain) }) diff --git a/packages/vue-i18n-core/test/diretive.test.ts b/packages/vue-i18n-core/test/diretive.test.ts index faa926c00..44ca503d6 100644 --- a/packages/vue-i18n-core/test/diretive.test.ts +++ b/packages/vue-i18n-core/test/diretive.test.ts @@ -19,7 +19,7 @@ import { mount } from './helper' import { defineComponent, ref, h, withDirectives, resolveDirective } from 'vue' import { format } from '@intlify/shared' import { - compileToFunction, + compile, registerMessageCompiler, resolveValue, registerMessageResolver, @@ -28,10 +28,9 @@ import { } from '@intlify/core-base' import { createI18n } from '../src/index' import { errorMessages, I18nErrorCodes } from '../src/errors' -import { getWarnMessage, I18nWarnCodes } from '../src/warnings' beforeAll(() => { - registerMessageCompiler(compileToFunction) + registerMessageCompiler(compile) registerMessageResolver(resolveValue) registerLocaleFallbacker(fallbackWithLocaleChain) }) diff --git a/packages/vue-i18n-core/test/i18n.test.ts b/packages/vue-i18n-core/test/i18n.test.ts index 5dc87e8f3..192c97566 100644 --- a/packages/vue-i18n-core/test/i18n.test.ts +++ b/packages/vue-i18n-core/test/i18n.test.ts @@ -24,7 +24,7 @@ import { } from 'vue' import { setDevToolsHook, - compileToFunction, + compile, registerMessageCompiler, resolveValue, registerMessageResolver, @@ -47,7 +47,7 @@ const container = document.createElement('div') document.body.appendChild(container) beforeAll(() => { - registerMessageCompiler(compileToFunction) + registerMessageCompiler(compile) registerMessageResolver(resolveValue) registerLocaleFallbacker(fallbackWithLocaleChain) }) diff --git a/packages/vue-i18n-core/test/issues.test.ts b/packages/vue-i18n-core/test/issues.test.ts index ed9fef922..1e74b16f1 100644 --- a/packages/vue-i18n-core/test/issues.test.ts +++ b/packages/vue-i18n-core/test/issues.test.ts @@ -24,7 +24,7 @@ import { } from 'vue' import { setDevToolsHook, - compileToFunction, + compile, registerMessageCompiler, resolveValue, registerMessageResolver, @@ -43,7 +43,7 @@ document.body.appendChild(container) let org: any // eslint-disable-line @typescript-eslint/no-explicit-any let spy: any // eslint-disable-line @typescript-eslint/no-explicit-any beforeEach(() => { - registerMessageCompiler(compileToFunction) + registerMessageCompiler(compile) registerMessageResolver(resolveValue) registerLocaleFallbacker(fallbackWithLocaleChain) diff --git a/packages/vue-i18n-core/test/legacy.test.ts b/packages/vue-i18n-core/test/legacy.test.ts index 7236446c6..8efe0cea3 100644 --- a/packages/vue-i18n-core/test/legacy.test.ts +++ b/packages/vue-i18n-core/test/legacy.test.ts @@ -16,7 +16,7 @@ import { createVueI18n } from '../src/legacy' import { errorMessages, I18nErrorCodes } from '../src/errors' import { watchEffect, nextTick } from 'vue' import { - compileToFunction, + compile, registerMessageCompiler, resolveValue, registerMessageResolver, @@ -27,7 +27,7 @@ import { import { pluralRules as _pluralRules } from './helper' beforeEach(() => { - registerMessageCompiler(compileToFunction) + registerMessageCompiler(compile) registerMessageResolver(resolveValue) }) diff --git a/packages/vue-i18n-core/test/mixin.test.ts b/packages/vue-i18n-core/test/mixin.test.ts index 04876588c..3db7d9720 100644 --- a/packages/vue-i18n-core/test/mixin.test.ts +++ b/packages/vue-i18n-core/test/mixin.test.ts @@ -15,7 +15,7 @@ vi.mock('@intlify/shared', async () => { import { mount } from './helper' import { defineComponent, nextTick } from 'vue' import { - compileToFunction, + compile, registerMessageCompiler, resolveValue, registerMessageResolver, @@ -27,7 +27,7 @@ import { errorMessages, I18nErrorCodes } from '../src/errors' import { VueI18n } from '../src/legacy' beforeAll(() => { - registerMessageCompiler(compileToFunction) + registerMessageCompiler(compile) registerMessageResolver(resolveValue) registerLocaleFallbacker(fallbackWithLocaleChain) }) diff --git a/packages/vue-i18n-core/test/ssr.test.ts b/packages/vue-i18n-core/test/ssr.test.ts index 99fe4f8b7..a3bf49c99 100644 --- a/packages/vue-i18n-core/test/ssr.test.ts +++ b/packages/vue-i18n-core/test/ssr.test.ts @@ -9,7 +9,7 @@ import { } from 'vue' import { renderToString } from '@vue/server-renderer' import { - compileToFunction, + compile, registerMessageCompiler, resolveValue, registerMessageResolver, @@ -19,7 +19,7 @@ import { import { createI18n, useI18n } from '../src/index' beforeAll(() => { - registerMessageCompiler(compileToFunction) + registerMessageCompiler(compile) registerMessageResolver(resolveValue) registerLocaleFallbacker(fallbackWithLocaleChain) }) diff --git a/packages/vue-i18n-core/test/wc.test.ts b/packages/vue-i18n-core/test/wc.test.ts index c5b5e9d50..187d668dd 100644 --- a/packages/vue-i18n-core/test/wc.test.ts +++ b/packages/vue-i18n-core/test/wc.test.ts @@ -10,7 +10,7 @@ import { getCurrentInstance } from 'vue' import { - compileToFunction, + compile, registerMessageCompiler, resolveValue, registerMessageResolver, @@ -26,7 +26,7 @@ const container = document.createElement('div') document.body.appendChild(container) beforeAll(() => { - registerMessageCompiler(compileToFunction) + registerMessageCompiler(compile) registerMessageResolver(resolveValue) registerLocaleFallbacker(fallbackWithLocaleChain) }) diff --git a/packages/vue-i18n/README.md b/packages/vue-i18n/README.md index d6900a76e..1a8dcadfb 100644 --- a/packages/vue-i18n/README.md +++ b/packages/vue-i18n/README.md @@ -49,8 +49,8 @@ Internationalization plugin for Vue.js - For use in Node.js via `import` - The dev/prod files are pre-built, but the appropriate file is automatically required based on `process.env.NODE_ENV` - This module is proxy module of `vue-i18n(.runtime).mjs` - - **`vue-i18n.runtime.node.mjs`**: is runtime only. proxy `vue-i18n.runtime.mjs` - - **`vue-i18n.node.mjs`**: includes the runtime compiler. proxy `vue-i18n.mjs` + - **`vue-i18n.runtime.node.mjs`**: is runtime only + - **`vue-i18n.node.mjs`**: includes the runtime compiler > NOTE: ES Modules will be the future of the Node.js module system. The `vue-i18n.cjs(.prod).js` will be deprecated in the future. We recommend you would use `vue-i18n(.runtime).node.mjs`. 9.3+ @@ -63,10 +63,7 @@ The `esm-bundler` builds now exposes global feature flags that can be overwritte - `__VUE_I18N_FULL_INSTALL__` (enable/disable, in addition to vue-i18n APIs, components and directives all fully support installation: `true`) - `__VUE_I18N_LEGACY_API__` (enable/disable vue-i18n legacy style APIs support, default: `true`) -- `__INTLIFY_JIT_COMPILATION__` (enable/disable message compiler for JIT style, default: `false`) -- `__INTLIFY_DROP_MESSAGE_COMPILER__` (enable/disable whether to tree-shake message compiler when we will be bundling, this flag works when `__INTLIFY_JIT_COMPILATION__` is enabled. default: `false`) - -> NOTE: `__INTLIFY_JIT_COMPILATION__`, `__INTLIFY_DROP_MESSAGE_COMPILER__` flag support version, 9.3+ +- `__INTLIFY_DROP_MESSAGE_COMPILER__` (enable/disable whether to tree-shake message compiler when we will be bundling) The build will work without configuring these flags, however it is **strongly recommended** to properly configure them in order to get proper tree shaking in the final bundle. To configure these flags: @@ -76,6 +73,6 @@ The build will work without configuring these flags, however it is **strongly re Note: the replacement value **must be boolean literals** and cannot be strings, otherwise the bundler/minifier will not be able to properly evaluate the conditions. -## :copyright: License +## ©️ License [MIT](http://opensource.org/licenses/MIT) diff --git a/packages/vue-i18n/src/index.ts b/packages/vue-i18n/src/index.ts index b54545d20..ae725bb8e 100644 --- a/packages/vue-i18n/src/index.ts +++ b/packages/vue-i18n/src/index.ts @@ -2,7 +2,6 @@ import { getGlobalThis } from '@intlify/shared' import { setDevToolsHook, registerMessageCompiler, - compileToFunction, compile, registerMessageResolver, resolveValue, @@ -16,16 +15,7 @@ if (__ESM_BUNDLER__ && !__TEST__) { } // register message compiler at vue-i18n -if ( - __ESM_BROWSER__ || - __NODE_JS__ || - __GLOBAL__ || - __FEATURE_JIT_COMPILATION__ -) { - registerMessageCompiler(compile) -} else { - registerMessageCompiler(compileToFunction) -} +registerMessageCompiler(compile) // register message resolver at vue-i18n registerMessageResolver(resolveValue) diff --git a/packages/vue-i18n/src/runtime.ts b/packages/vue-i18n/src/runtime.ts index c57f6c165..4ea64a04a 100644 --- a/packages/vue-i18n/src/runtime.ts +++ b/packages/vue-i18n/src/runtime.ts @@ -15,9 +15,7 @@ if (__ESM_BUNDLER__ && !__TEST__) { } // register message compiler for jit compilation -if (__FEATURE_JIT_COMPILATION__) { - registerMessageCompiler(compile) -} +registerMessageCompiler(compile) // register message resolver at vue-i18n registerMessageResolver(resolveValue) diff --git a/rollup.config.mjs b/rollup.config.mjs index bf6e200e3..da40190ad 100644 --- a/rollup.config.mjs +++ b/rollup.config.mjs @@ -327,9 +327,6 @@ function createReplacePlugin( __FEATURE_PROD_INTLIFY_DEVTOOLS__: isBundlerESMBuild ? `__INTLIFY_PROD_DEVTOOLS__` : `false`, - __FEATURE_JIT_COMPILATION__: isBundlerESMBuild - ? `__INTLIFY_JIT_COMPILATION__` - : `false`, __FEATURE_DROP_MESSAGE_COMPILER__: isBundlerESMBuild ? `__INTLIFY_DROP_MESSAGE_COMPILER__` : `false`, diff --git a/vitest.config.ts b/vitest.config.ts index 53f2ac55d..ea5b1a656 100644 --- a/vitest.config.ts +++ b/vitest.config.ts @@ -17,7 +17,6 @@ export default defineConfig({ __LITE__: false, __FEATURE_FULL_INSTALL__: true, __FEATURE_LEGACY_API__: true, - __FEATURE_JIT_COMPILATION__: true, __FEATURE_DROP_MESSAGE_COMPILER__: false }, resolve: {