i18n not working after switching to vite

[juliandierker]

Hey we maintain a big meteor typescript project and we are desperately looking for a faster building solution than meteor standart bundle system. We are trying out vite right now with this package and running into an issue that after installing and configurating our i18n translation in app breaks somehow.

We use i18n via universe:i18n and translation lives in root directory in a folder called i18n in yml format.

Thx for any ideas and help.

[Akryum]

Do you mind putting up a reproduction I can clone? Thanks!

[juliandierker]

I'm not allowed to send out invitations to forks :( Project-Structure is:

i could reproduce a smaller project for sure.

General questions: What is the status of meteor-vite overall? is there any chance this becomes official meteor package?

[PatrickKaim]

I seem to have the same issue. Very easy to reproduce. I've setup a simple project: https://github.com/PatrickKaim/VueI18NTest.git

How to reproduce:

• Run meteor create projectName --vue
• cd projectName
• Run meteor npm install vue-i18n
• Run meteor npm install --save-dev @intlify/vite-plugin-vue-i18n
• Edit ui/main.js
• Add to top: import {createI18n} from "vue-i18n"; import messages from '@intlify/vite-plugin-vue-i18n/messages'
• Add: ` const userLocale = navigator.languages && navigator.languages.length ? navigator.languages[0] : navigator.language;

const i18n = createI18n({ legacy: false, locale: userLocale, fallbackLocale: 'en-US', globalInjection: true, missingWarn: false, fallbackWarn: false, messages }) `

• Add inside: Meteor.startup(() => { ... app.use(i18n) ... }

• Close ui/main.js

• Edit vite.config.js

• Add to top: import {dirname, resolve} from "node:path"; import {fileURLToPath} from "url"; import vueI18n from '@intlify/vite-plugin-vue-i18n'

• Add inside: plugins: [ vue(), vueI18n({ /* options */ // locale messages resource pre-compile option include: resolve(dirname(fileURLToPath(import.meta.url)), './i18n/**'), }), ],

• Close vite.config.js

• Add directory i18n to project root and add two json language files

• en.json {"welcome": "Welcome" }

• nl.json {"welcome": "Welkom"}

• run meteor

Project should work on localhost:3000

• Run meteor build ../output Error will occur

[PatrickKaim]

Just to make sure the build is working I created a clean project and just did a build. Build went ok but bundling didn't.

meteor create project --vue And did a run => works And a build (meteor build ../output) => errors

meteor build ../output ⚡️ Building packages to make them available to export analyzer... ⚡️ Packages built (11591.01ms) ⚡️ Building with Vite... vite v3.2.5 building for production... transforming... ✓ 33 modules transformed. rendering chunks... node_modules/.vite-meteor/dist/meteor-entry.js 0.02 KiB / gzip: 0.04 KiB node_modules/.vite-meteor/dist/About.js 0.59 KiB / gzip: 0.33 KiB node_modules/.vite-meteor/dist/main.js 284.71 KiB / gzip: 67.26 KiB

⚡️ Build successful (733.51ms) Errors prevented bundling:
While minifying app code:
packages/minifyStdJS/plugin/minify-js.js:49:25: terser minification error (SyntaxError:"Import" statement may only appear at the top level) Source file: client/main.js (2:0) Line content: import "./vite/meteor-entry.js"

at maybeThrowMinifyErrorBySourceFile (packages/minifyStdJS/plugin/minify-js.js:49:25) at packages/minifyStdJS/plugin/minify-js.js:77:11 at Array.forEach () at MeteorMinifier.processFilesForBundle (packages/minifyStdJS/plugin/minify-js.js:66:11)

While minifying app code: packages/minifyStdJS/plugin/minify-js.js:49:25: terser minification error (SyntaxError:"Import" statement may only appear at the top level) Source file: client/main.js (2:0) Line content: import "./vite/meteor-entry.js"

at maybeThrowMinifyErrorBySourceFile (packages/minifyStdJS/plugin/minify-js.js:49:25) at packages/minifyStdJS/plugin/minify-js.js:77:11 at Array.forEach () at MeteorMinifier.processFilesForBundle (packages/minifyStdJS/plugin/minify-js.js:66:11)