unplugin-vue-i18n: regression with v0.9.1 - unexpected token: '{' about bundle-tools HOT 10 CLOSED

Hi! Thank you for you reproduction repo quickly.

I looked at your vite.config.
I see that src/locale/index.ts is now in the transform of i18n resources.
I recommend configuring the include option to unplugin-vue-i18n to prevent your application code from being included.

from bundle-tools.

Please could you also give us vite.config?

from bundle-tools.

I've just added the notice docs.

⚠️ NOTE: If you use the js and ts resources formats, set the paths, so your application code is not targeted. We recommend that resources be isolated from the application code.

https://github.com/intlify/bundle-tools/tree/main/packages/unplugin-vue-i18n#include

So, close this issue.
Thanks!

from bundle-tools.

Hi!
Thank you for your reproduction!
I've just checked it!

It's rare for this issue to occur.

In generally, when we are using vue-i18n, i18n resources should be organized in a directory such as locales or lang.
In that case, the include option of unplugin-vue-i18n should be set to include: path.resolve(__dirname, 'src/locales/**').
With that setting, unplugin-vue-i18n will only transform for 'src/locales/**', so you will not have this issue.

But, we should write clearly to docs that we should organize for js and ts format resources.

from bundle-tools.

Same issue encountered here. The part before { is an array. The code transform is buggy in 0.9.1

from bundle-tools.

src/locale/index.ts

import { createI18n } from 'vue-i18n';

export const WHATEVER_THE_FIRST_EXPORT = ['WHATEVER_THE_FIRST_EXPORT'];

const i18n = createI18n({
  locale: 'zh-CN',
  fallbackLocale: 'en-US',
  allowComposition: true,
  messages: {
    'en-US': {},
    'zh-CN': {},
  },
});

export default i18n;

Transformed:

export default [
  (()=>{const fn=(ctx) => {const { normalize: _normalize } = ctx;return _normalize(["WHATEVER_THE_FIRST_EXPORT"])};fn.source="WHATEVER_THE_FIRST_EXPORT";return fn;})(),
  
]{
  "locale": (()=>{const fn=(ctx) => {const { normalize: _normalize } = ctx;return _normalize(["zh-CN"])};fn.source="zh-CN";return fn;})(),
  "fallbackLocale": (()=>{const fn=(ctx) => {const { normalize: _normalize } = ctx;return _normalize(["en-US"])};fn.source="en-US";return fn;})(),
  "allowComposition": true,
  "messages": {
    "en-US": {
      
    },
    "zh-CN": {
      
    }
  }
}

from bundle-tools.

I'll setup a proper reproduction repo for it. Give me a second :)

from bundle-tools.

@kazupon The reproduction is at https://github.com/Tanimodori/unplugin-vue-i18n-regression-repro

from bundle-tools.

The example of @cexbrayat is also causing the error:

import { createI18n } from "vue-i18n";

const en = {};

const i18n = createI18n({
  locale: "en",
  messages: {
    en,
  },
});

export default i18n;

export default {
  
}{
  "locale": (()=>{const fn=(ctx) => {const { normalize: _normalize } = ctx;return _normalize(["en"])};fn.source="en";return fn;})(),
  "messages": {
    
  }
}

from bundle-tools.

So this is the limitation mentioned at https://github.com/intlify/bundle-tools/tree/main/packages/unplugin-vue-i18n#include

⚠️ NOTE: js and ts resources are limited to simple export (export default) as locale messages object only, such as programmatically dynamic resource construction is not guaranteed to work currently.

v0.8.2 happens to be working and 0.9.1 doesn't.

I'll remove the include in my config since I don't use pre-compile. Thanks for your quick help!

from bundle-tools.