Hello, I recently developed a project using meteor.js + vite + svelte.js(5). When I wanted to publish my project, I think the meteor build in the meteor-vite package produced an unexpected output. I opened an issue below. Is there a different situation in newer versions? Thank you.
looking the error i havent a ready ansewer in mind, but do you have any reproducible repository? I can debug using meteor’s source to understand what is happening
Thank you very much for your response. I will prepare a repo for this. I will send it from here.
Hello again, I’m sharing the trimmed version of the project I’m working on. The same problem persists.
Also, when I run meteor build on mac(arm), the process stops halfway and doesn’t give any error. When I do it on a linux(x86)-based PC, I get the same error.
oh, i’m sorry I missed it, i’ll bring news tomorrow for sure!
1 Like
Before debugging, @nachocodoner do you have any insight here? it looks somehthing in the build
italojose@italo-machine: ~/dev/meteor-dev/apps/dev-randuu.com main ⚡
$ meteor build ../output [11:35:26]
⚡ Setup jorgenvatle:vite v1.6.0-beta.2 /
⚡ Setup meteor-vite v3.9.0-beta.1
⚡ Setup meteor-vite is out of date! Try updating it: npm i meteor-vite@9.3
⚡ Setup jorgenvatle:vite is out of date! Try updating it: meteor update jorgenvatle:vite
⚡ Setup Cleaned up old build output in /Users/italojose/dev/meteor-dev/apps/dev-randuu.com/_vite-bundle/dist
⚡ [PRODUCTION] Vite v6.4.0 (MeteorVite v3.9.0-beta.1 - undefined)
⚡ [PRODUCTION] Resolving Vite config...
(node:58610) Warning: vm.USE_MAIN_CONTEXT_DEFAULT_LOADER is an experimental feature and might change at any time
(Use `node --trace-warnings ...` to show where the warning was created)
⚡ [PRODUCTION] Building with Vite v6.4.0...\
⚡ Building packages to make them available to export analyzer...
⚡ Packages built in 12,744ms
⚡ [PRODUCTION] Preparing server bundle...
vite v6.4.0 building SSR bundle for production...
"Mongo" is imported from external module "meteor/mongo" but never used in "imports/api/collections/users/collection.ts", "lib/utils/db/easy-search.ts" and "lib/utils/db/fetch-by-index.ts".
"default" is imported from external module "zod" but never used in "imports/api/collections/users/schema.ts", "imports/api/common-schemas/options.ts", "imports/api/methods/auth/users/change-password.ts", "imports/api/methods/validate/index.ts" and "imports/api/methods/auth/users/update-profile.ts".
✓ 44 modules transformed.
_vite-bundle/dist/entry-server/main-DPhK74Lb.entry.js 44.17 kB │ map: 85.05 kB
✓ built in 108ms
⚡ [PRODUCTION] Preparing client bundle...
vite v6.4.0 building for production...
file:///Users/italojose/dev/meteor-dev/apps/dev-randuu.com/node_modules/meteor-vite/dist/chunk-PTULOKHP.mjs:1462
throw new MeteorViteStubRequestError(`Unable to read file content: ${fsError.message}`);
^
MeteorViteStubRequestError: Unable to read file content: ENOENT: no such file or directory, open '/var/folders/s0/nb49xjfs01x71_qm9x7p44d40000gn/T/meteor-vite/out/dev-randuu.com/bundle/programs/web.browser/packages/meteor.js'
at file:///Users/italojose/dev/meteor-dev/apps/dev-randuu.com/node_modules/meteor-vite/src/plugin/lib/ViteLoadRequest.ts:149:19 {
package: undefined,
context: undefined,
cause: undefined,
subtitle: undefined,
metadataLines: [],
originalMessage: "Unable to read file content: ENOENT: no such file or directory, open '/var/folders/s0/nb49xjfs01x71_qm9x7p44d40000gn/T/meteor-vite/out/dev-randuu.com/bundle/programs/web.browser/packages/meteor.js'"
}
Node.js v22.18.0
FAIL: 1
1 Like
I tried to look for a fix on your reproduction, but as far as I understand this is an issue in meteor-vite internals, which I’m not experienced with. I haven’t even used the meteor-vite community package in real projects, and officially in core we’re moving forward with the Rspack integration.
Because of that I can’t really give insights here without doing a deep dive into meteor-vite and getting more hands-on with it. Maybe @jorgenvatle can help here, since this is support for a community package.
1 Like
@nachocodoner Can we use Rspack with Svelte 5? Is the exports feature in packages.json supported? The only reason I use meteor-vite is because it allows me to use Svelte 5.
Yes, you can. It would actually be great if you migrate and share feedback.
Since the first 3.4 beta we’ve focused on keeping the main Meteor skeletons stable: React, Vue, Solid, and also Svelte.
You can follow the details in this forum post (current latest is 3.4-beta.12):
The docs are important to understand requirements and migration steps: Rspack Bundler Integration | Docs For most apps it should not be a big effort. If you do hit an issue, please check the docs and report it so we can improve them.
About Svelte: as long as you’re not using zodern:melte and syntax features like $ or $m, you’re fine. I assume that if you’re using Meteor + Vite today, your Svelte project is not using that package. If that’s the case, good news: migration should be more direct.
We also have a basic Svelte app created with meteor create --svelte --release 3.4-beta.12. That shows how the base setup works. It uses Svelte 5. We even have test coverage to confirm it works.
One last note: adopting Rspack means you get an advanced config surface for your project. The documentation now expands on Rspack, so if you see conventions from Svelte or elsewhere about Webpack/Rspack integration, you should be able to apply them with Meteor + Rspack.
2 Likes
@nachocodoner We couldn’t find a solution for meteor-vite, but that’s okay—I’ll try it in my free time and give you feedback.
1 Like
Hello, I migrated my project to the rspack framework and wanted to share the issues I encountered and their solutions here.
package.json
{
"name": "randuu",
"private": true,
"scripts": {
"start": "meteor run --settings settings.json",
"test": "meteor test --once --driver-package meteortesting:mocha",
"test-app": "TEST_WATCH=1 meteor test --full-app --driver-package meteortesting:mocha",
"visualize": "meteor --production --extra-packages bundle-visualizer",
"build": "meteor build ../output/svelte --directory"
},
"dependencies": {
"@babel/runtime": "^7.23.5",
"@swc/helpers": "^0.5.17",
"@tailwindcss/vite": "^4.1.8",
"@zxing/browser": "^0.1.5",
"@zxing/library": "^0.21.3",
"clsx": "^2.1.1",
"dayjs": "^1.11.13",
"escape-string-regexp": "^5.0.0",
"flowbite": "^3.1.2",
"flowbite-svelte": "^1.20.1",
"flowbite-svelte-icons": "^3.0.0",
"leaflet": "^1.9.4",
"lucide-svelte": "^0.542.0",
"meteor-node-stubs": "^1.2.12",
"notiflix": "^3.2.8",
"qrcode": "^1.5.4",
"slugify": "^1.6.6",
"tailwindcss": "^4.1.8",
"toastify-js": "^1.12.0",
"winston": "^3.17.0",
"zod": "^4.1.9"
},
"devDependencies": {
"@meteorjs/rspack": "^0.0.60",
"@rsdoctor/rspack-plugin": "^1.2.3",
"@rspack/cli": "^1.5.3",
"@rspack/core": "^1.5.3",
"@tailwindcss/postcss": "^4.1.16",
"@tsconfig/svelte": "^5.0.0",
"@types/leaflet": "^1.9.20",
"@types/mocha": "^10.0.10",
"@types/node": "^22.15.29",
"@types/toastify-js": "^1.12.4",
"prettier-plugin-organize-imports": "^4.0.0",
"postcss-load-config": "^6.0.1",
"svelte": "^5.38.2",
"svelte-check": "^4.3.1",
"svelte-loader": "^3.2.4",
"svelte-preprocess": "^6.0.3",
"tinro5": "^0.0.11",
"typescript": "^5.1.6"
},
"meteor": {
"mainModule": {
"client": "client/main.ts",
"server": "server/main.ts"
},
"testModule": "tests/main.js",
"modern": true
}
}
rspack.config.js
const { defineConfig } = require('@meteorjs/rspack')
const sveltePreprocess = require('svelte-preprocess')
const path = require('path')
module.exports = defineConfig((Meteor) => {
return {
...(Meteor.isClient && {
resolve: {
extensions: ['.mjs', '.js', '.ts', '.svelte', '.json'],
mainFields: ['svelte', 'browser', 'module', 'main'],
conditionNames: ['svelte', 'browser', 'import', 'module'],
alias: {
tinro5: path.resolve(__dirname, 'node_modules/tinro5/dist/tinro.es.js'),
},
},
module: {
rules: [
{
test: /\.svelte$/,
use: [
{
loader: 'svelte-loader',
options: {
compilerOptions: { dev: !Meteor.isProduction },
emitCss: Meteor.isProduction,
hotReload: !Meteor.isProduction,
preprocess: sveltePreprocess({
sourceMap: !Meteor.isProduction,
postcss: true,
}),
},
},
],
},
{
// ESM strict modüllerde uzantısız importları düzelt
test: /\.m?js$/,
resolve: {
fullySpecified: false,
},
},
],
},
}),
}
})
I’m also getting the following error, but my project is working.
~/works/randuu.com/ [dev*] npm run start
> start
> meteor run --settings settings.json
[[[[[ ~/works/randuu.com ]]]]]
=> Started proxy.
=> Started HMR server.
=> Started MongoDB.
[Rspack Server] [server-rspack]:package ... -
[server-rspack] compiled successfully in 105 ms
[Rspack Client] <i> [webpack-dev-server] Project is running at:
[Rspack Client] <i> [webpack-dev-server] Loopback: http://localhost:8080/, http://[::1]:8080/
<i> [webpack-dev-server] On Your Network (IPv4): http://192.168.1.109:8080/
<i> [webpack-dev-server] On Your Network (IPv6): http://[fdbc:8d52:d218:0:d:bd27:8382:9ceb]:8080/
<i> [webpack-dev-server] Content not from webpack is served from '/Users/recepozen/works/randuu.com/public' directory
[Rspack Client Error] ack` from package ... |
WARNING: You should add "svelte" to the "resolve.conditionNames" array in your webpack config. See https://github.com/sveltejs/svelte-loader#resolveconditionnames for more information
[Rspack Client] [client-rspack]:package ... |
[client-rspack] compiled successfully in 3.92 s
Unable to resolve some modules:
"#default#VML" in /Users/recepozen/works/randuu.com/_build/main-dev/client-meteor.js (web.browser)
If you notice problems related to these missing modules, consider running:
meteor npm install --save #default#VML
=> Linted your app. No linting errors.
Meteor is running
(node:11362) Warning: The `util._extend` API is deprecated. Please use Object.assign() instead.
(Use `node --trace-warnings ...` to show where the warning was created)
=> Started your app.
=> App running at: http://localhost:3000/
{"line":"104","file":"migrations_server.js","message":"Migrations: Not migrating, already at version 2","time":{"$date":1762024228416},"level":"info"}
(node:11930) Warning: The `util._extend` API is deprecated. Please use Object.assign() instead.
(Use `node --trace-warnings ...` to show where the warning was created)
Finally, I use Tailwind 4, so I created a postcss.config.js file in the root directory for this.
postcss.config.js
module.exports = {
plugins: {
'@tailwindcss/postcss': {},
},
}
1 Like
Additionally, compose and dockerfile that I use for deployment
services:
app:
build:
context: .
dockerfile: Dockerfile
expose:
- '3000'
environment:
ROOT_URL: ${APP_ROOT_URL:-http://localhost:3000}
MONGO_URL: ${APP_MONGO_URL:-mongodb://localhost:27017/meteor}
METEOR_SETTINGS: ${APP_METEOR_SETTINGS:-{}}
PORT: 3000
volumes:
data:
# The tag here should match the Meteor version of your app, per .meteor/release
FROM geoffreybooth/meteor-base:3.3.2
# Copy app package.json and package-lock.json into container
COPY ./package*.json $APP_SOURCE_FOLDER/
RUN bash $SCRIPTS_FOLDER/build-app-npm-dependencies.sh
# Copy app source into container
COPY . $APP_SOURCE_FOLDER/
# Ensure node is in PATH before building
RUN ln -s /root/.meteor/packages/meteor-tool/*/mt-os.linux.x86_64/dev_bundle/bin/node /usr/local/bin/node || true
RUN bash $SCRIPTS_FOLDER/build-meteor-bundle.sh
# Use the specific version of Node expected by your Meteor release, per https://docs.meteor.com/changelog.html; this is expected for Meteor 3.3.2
FROM node:22.19.0-alpine
ENV APP_BUNDLE_FOLDER=/opt/bundle
ENV SCRIPTS_FOLDER=/docker
# Install OS build dependencies, which stay with this intermediate image but don’t become part of the final published image
RUN apk --no-cache add \
bash \
g++ \
make \
python3
# Copy in entrypoint
COPY --from=0 $SCRIPTS_FOLDER $SCRIPTS_FOLDER/
# Copy in app bundle
COPY --from=0 $APP_BUNDLE_FOLDER/bundle $APP_BUNDLE_FOLDER/bundle/
RUN bash $SCRIPTS_FOLDER/build-meteor-npm-dependencies.sh --build-from-source
# Start another Docker stage, so that the final image doesn’t contain the layer with the build dependencies
# See previous FROM line; this must match
FROM node:22.19.0-alpine
ENV APP_BUNDLE_FOLDER=/opt/bundle
ENV SCRIPTS_FOLDER=/docker
# Install OS runtime dependencies
RUN apk --no-cache add \
bash \
ca-certificates
# Copy in entrypoint with the built and installed dependencies from the previous image
COPY --from=1 $SCRIPTS_FOLDER $SCRIPTS_FOLDER/
# Copy in app bundle with the built and installed dependencies from the previous image
COPY --from=1 $APP_BUNDLE_FOLDER/bundle $APP_BUNDLE_FOLDER/bundle/
RUN printenv
# Start app
ENTRYPOINT ["/docker/entrypoint.sh"]
CMD ["node", "main.js"]
EXPOSE 3000
1 Like
@nachocodoner Hello again, I have two questions. How should I proceed with rspack regarding SSR and mobile?
Meteor’s SSR and Cordova native support work the same as in Meteor 3.
If you mean other SSR or native integrations in the Rspack world, that’s open for anyone to explore. If the bundler ecosystem can help there, we can look at adding those setups to core.
Please help test Meteor’s SSR and Cordova after the Rspack integration, and try new approaches with Rspack.
For Meteor 3.4, which will go official soon, we’ve laid the initial groundwork so everyone can start. In next releases, we may expand further depending on our experimentation.