JorgenVatle / meteor-vite

āš” Replace Meteor's bundler with Vite for blazing fast build-times
MIT License
32 stars 10 forks source link

Problems setting up meteor-vite #156

Closed malua closed 5 months ago

malua commented 7 months ago

Hey Jorgen,

thank you so much for your work on this bundler!

I am trying to set it up with a large Meteor project (2.12) but I get this error in the console when running meteor run

$ meteor run

=> Started proxy.                             
=> Errors prevented startup:                  

   While building the application:
   error: Could not find mainModule for 'os' architecture: server/main.ts
   Check the "meteor" section of your package.json file?
   error: Could not find mainModule for 'web.browser' architecture: imports/entrypoint/meteor.ts
   Check the "meteor" section of your package.json file?
   error: Could not find mainModule for 'web.browser.legacy' architecture: imports/entrypoint/meteor.ts
   Check the "meteor" section of your package.json file?

=> Your application has errors. Waiting for file change.
=> Meteor 2.15 is available. Check the changelog https://docs.meteor.com/changelog.html and update this project with 'meteor
update'.
=> Started MongoDB.

I have set everything up like in the docs.

The project is using typescript but until now we haven't used the typescript compiler from meteor. Instead the app was served like this: tsc -w & meteor

When I run meteor run now a file called meteor-entry.js._vite-bundle.tmp is created in the client folder. But other than that there is no information if vite is actually running or not.

My mainModule config in package.json

  "meteor": {
    "mainModule": {
      "client": "imports/entrypoint/meteor.ts",
      "server": "server/main.ts"
    }
  },

My vite config:

// vite.config.ts
import { defineConfig } from "vite";
import { meteor } from "meteor-vite/plugin";
import react from "@vitejs/plugin-react";

export default defineConfig({
  plugins: [
    meteor({
      clientEntry: "imports/entrypoint/vite.ts",
      stubValidation: {
        warnOnly: true
      }
    }),
    react({
      jsxRuntime: "classic"
    })
  ],
  optimizeDeps: {
    exclude: ["@meteor-vite/react-meteor-data"]
  }
});

My packages:

# Meteor packages used by this project, one per line.
# Check this file (and the other files in this directory) into your repository.
#
# 'meteor add' and 'meteor remove' will edit this file for you,
# but you can also edit it by hand.

meteor-base@1.5.1             # Packages every Meteor app needs to have
mobile-experience@1.1.0       # Packages for a great mobile UX
mongo@1.16.6                   # The database Meteor supports right now
reactive-var@1.0.12            # Reactive variable for tracker

standard-minifier-css@1.9.2   # CSS minifier run for production mode
standard-minifier-js@2.8.1    # JS minifier run for production mode
es5-shim@4.8.0                # ECMAScript 5 compatibility for older browsers
ecmascript@0.16.7              # Enable ECMAScript2015+ syntax in app code
shell-server@0.5.0            # Server-side component of the `meteor shell` command

meteortesting:mocha               # A package for writing and running your meteor app and package tests with mocha
johanbrook:publication-collector  # Test a Meteor publication by collecting its output
check@1.3.2
email@2.2.5
#aldeed:simple-schema
aldeed:collection2          #For automated schema validation
static-html@1.3.2
ostrio:files
nathantreid:css-modules
accounts-password@2.3.4
accounts-base@2.2.8
alanning:roles
#adornis:typescript
lamhieu:hypersubs
percolate:find-from-publication
matb33:collection-hooks
http@1.4.2
ostrio:logger
ostrio:loggerfile
tunguska:reactive-aggregate
jorgenvatle:vite-bundler

I would appreciate any clues as to what might be wrong. Thank you and all the best!

JorgenVatle commented 6 months ago

If Mereor doesn't have the typescript package, I believe *.ts files won't be resolved for Meteor's mainModule entries. Replacing server/main.ts in your package.json with server/main.js should resolve the issue for you unless I'm mistaken. Make sure you also rename the main.ts file to have a .js extension as well.

Alternatively, just adding Meteor's typsscript package with the following command should resolve the issue:

meteor add typescript

If the issue persists even after adding the typescript package, would you be able to share an example repository reproducing the issue? šŸ™

malua commented 6 months ago

Of course that makes sense, thank you so much.

Setting up a example repository is a little bit tricky, because I think the issues come from this older project...

I am one step further, now I have some issues regarding certain packages. I have @babel/runtime & @mui/icons-material installed, also meteor-accounts-t9n.

Unable to resolve some modules:

  "@babel/runtime/helpers/objectSpread2" in REMOVED/imports/api/courses/server/publications.ts (os.osx.x86_64)
  "@babel/runtime/helpers/objectWithoutProperties" in REMOVED/imports/ui/admin/components/datetimepicker.tsx (os.osx.x86_64)
  "@babel/runtime/helpers/extends" in REMOVED/imports/ui/admin/components/datetimepicker.tsx (os.osx.x86_64)
  "@mui/icons-material/CloudUpload" in REMOVED/imports/ui/admin/components/imageUploadField.tsx (os.osx.x86_64)
  "@mui/icons-material/InsertPhoto" in REMOVED/imports/ui/admin/components/imageUploadField.tsx (os.osx.x86_64)
  "@mui/icons-material/Close" in REMOVED/imports/ui/admin/components/imageUploadField.tsx (os.osx.x86_64)
  "@babel/runtime/helpers/objectDestructuringEmpty" in REMOVED/imports/ui/admin/components/customSubmitField.tsx (os.osx.x86_64)
  "@mui/icons-material/Info" in REMOVED/imports/ui/admin/components/videoUploadField.tsx (os.osx.x86_64)
  "meteor-accounts-t9n/build/de" in REMOVED/imports/startup/both/accounts-config.ts (os.osx.x86_64)

If you notice problems related to these missing modules, consider running:

  meteor npm install --save @babel/runtime @mui/icons-material meteor-accounts-t9n

=> Started MongoDB.                           
malua commented 6 months ago

Ok installing the newest packages (or simply reinstalling) of babel runtime and mui icons fixed these two issues.

And meteor-accounts-t9n somehow was not built when installed with npm. Reinstalling also helped in this case.

Now it's only this error:

REMOVED.meteor/packages/meteor-tool/.2.12.0.3wwjm4.k290j++os.osx.x86_64+web.browser+web.browser.legacy+web.cordova/mt-os.osx.x86_64/dev_bundle/lib/node_modules/meteor-promise/promise_server.js:218
      throw error;
      ^

Error: Broken symbolic link encountered at REMOVED/node_modules/.bin/JSONStream
    at isWithinProdPackage (/tools/isobuild/bundler.js:495:19)
    at /tools/isobuild/builder.js:724:15
    at Array.forEach (<anonymous>)
    at walk (/tools/isobuild/builder.js:656:34)
    at /tools/isobuild/builder.js:734:11
    at Array.forEach (<anonymous>)
    at walk (/tools/isobuild/builder.js:656:34)
    at Builder._copyDirectory (/tools/isobuild/builder.js:788:5)
    at Builder.copyNodeModulesDirectory (/tools/isobuild/builder.js:550:17)
    at /tools/isobuild/bundler.js:2569:17
    at Function.each (REMOVED.meteor/packages/meteor-tool/.2.12.0.3wwjm4.k290j++os.osx.x86_64+web.browser+web.browser.legacy+web.cordova/mt-os.osx.x86_64/dev_bundle/lib/node_modules/underscore/underscore-node-f-pre.js:1321:7)
    at JsImage.write (/tools/isobuild/bundler.js:2526:7)
    at ServerTarget.write (/tools/isobuild/bundler.js:2781:13)
    at /tools/isobuild/bundler.js:2949:30
    at /tools/isobuild/bundler.js:3088:11
    at Array.forEach (<anonymous>)
    at /tools/isobuild/bundler.js:3083:26
    at /tools/isobuild/bundler.js:3456:22
    at Object.capture (/tools/utils/buildmessage.js:283:5)
    at bundle (/tools/isobuild/bundler.js:3262:31)
    at /tools/isobuild/bundler.js:3205:32
    at Slot.withValue (REMOVED.meteor/packages/meteor-tool/.2.12.0.3wwjm4.k290j++os.osx.x86_64+web.browser+web.browser.legacy+web.cordova/mt-os.osx.x86_64/dev_bundle/lib/node_modules/@wry/context/lib/context.esm.js:69:29)
    at Object.withCache (REMOVED.meteor/packages/meteor-tool/.2.12.0.3wwjm4.k290j++os.osx.x86_64+web.browser+web.browser.legacy+web.cordova/mt-os.osx.x86_64/tools/fs/tools/fs/files.ts:1543:39)
    at Object.bundle (/tools/isobuild/bundler.js:3205:16)
    at /tools/runners/run-app.js:579:24
    at Function.run (REMOVED.meteor/packages/meteor-tool/.2.12.0.3wwjm4.k290j++os.osx.x86_64+web.browser+web.browser.legacy+web.cordova/mt-os.osx.x86_64/tools/tool-env/tools/tool-env/profile.ts:289:14)
    at bundleApp (/tools/runners/run-app.js:578:34)
    at AppRunner._runOnce (/tools/runners/run-app.js:625:35)
    at AppRunner._fiber (/tools/runners/run-app.js:947:28)
    at /tools/runners/run-app.js:408:12

Deleting node_modules and reinstalling helped.

malua commented 6 months ago

There are still some quirks, but I can surely figure them out. Thanks again for your help!

malua commented 6 months ago

Ok I thought I can find out myself, but I am not able to fix this: When i start the server with meteor run the following error appears.

I20240504-09:51:44.916(2)? āš”   Starting Vite server...
W20240504-09:51:44.928(2)? (STDERR) āš”  You are using an out of date version of `meteor-vite`.
W20240504-09:51:44.928(2)? (STDERR)    Please update it: $ meteor npm i meteor-vite@1.8.0
I20240504-09:51:45.267(2)?   āžœ  Local:   http://localhost:5173/
I20240504-09:51:45.268(2)?   āžœ  Network: use --host to expose
W20240504-09:51:46.365(2)? (STDERR) REMOVED/.meteor/packages/meteor-tool/.2.12.0.3wwjm4.k290j++os.osx.x86_64+web.browser+web.browser.legacy+web.cordova/mt-os.osx.x86_64/dev_bundle/server-lib/node_modules/fibers/future.js:280
W20240504-09:51:46.365(2)? (STDERR)                                             throw(ex);
W20240504-09:51:46.366(2)? (STDERR)                                             ^
W20240504-09:51:46.366(2)? (STDERR) 
W20240504-09:51:46.366(2)? (STDERR) Error: Cannot find module 'meteor/meteor'
W20240504-09:51:46.366(2)? (STDERR) Require stack:
W20240504-09:51:46.366(2)? (STDERR) - REMOVED/git/fsw-courses/node_modules/@meteor-vite/react-meteor-data/dist/index.js
W20240504-09:51:46.366(2)? (STDERR) - REMOVED/git/fsw-courses/.meteor/local/build/programs/server/npm-require.js
W20240504-09:51:46.366(2)? (STDERR) - REMOVED/git/fsw-courses/.meteor/local/build/programs/server/boot.js
W20240504-09:51:46.366(2)? (STDERR) - REMOVED/git/fsw-courses/.meteor/local/build/main.js
W20240504-09:51:46.366(2)? (STDERR)     at Function.Module._resolveFilename (internal/modules/cjs/loader.js:931:15)
W20240504-09:51:46.366(2)? (STDERR)     at Function.Module._load (internal/modules/cjs/loader.js:774:27)
W20240504-09:51:46.366(2)? (STDERR)     at Module.require (internal/modules/cjs/loader.js:1003:19)
W20240504-09:51:46.366(2)? (STDERR)     at require (internal/modules/cjs/helpers.js:107:18)
W20240504-09:51:46.366(2)? (STDERR)     at Object.<anonymous> (REMOVED/git/fsw-courses/node_modules/@meteor-vite/react-meteor-data/dist/index.js:56:21)
W20240504-09:51:46.366(2)? (STDERR)     at Module._compile (internal/modules/cjs/loader.js:1114:14)
W20240504-09:51:46.366(2)? (STDERR)     at Module.Mp._compile (REMOVED/git/fsw-courses/.meteor/local/build/programs/server/runtime.js:77:23)
W20240504-09:51:46.366(2)? (STDERR)     at Object.Module._extensions..js (REMOVED/git/fsw-courses/.meteor/local/build/programs/server/runtime.js:105:23)
W20240504-09:51:46.366(2)? (STDERR)     at Module.load (internal/modules/cjs/loader.js:979:32)
W20240504-09:51:46.366(2)? (STDERR)     at Module.Mp.load (REMOVED/git/fsw-courses/.meteor/local/build/programs/server/runtime.js:37:33)
W20240504-09:51:46.367(2)? (STDERR)     at Function.Module._load (internal/modules/cjs/loader.js:819:12)
W20240504-09:51:46.367(2)? (STDERR)     at Module.require (internal/modules/cjs/loader.js:1003:19)
W20240504-09:51:46.367(2)? (STDERR)     at require (internal/modules/cjs/helpers.js:107:18)
W20240504-09:51:46.367(2)? (STDERR)     at npmRequire (REMOVED/git/fsw-courses/.meteor/local/build/programs/server/npm-require.js:111:12)
W20240504-09:51:46.367(2)? (STDERR)     at Module.useNode (packages/modules-runtime.js:751:18)
W20240504-09:51:46.367(2)? (STDERR)     at module (packages/modules.js:6005:8) {
W20240504-09:51:46.367(2)? (STDERR)   code: 'MODULE_NOT_FOUND',
W20240504-09:51:46.367(2)? (STDERR)   requireStack: [
W20240504-09:51:46.367(2)? (STDERR)     'REMOVED/git/fsw-courses/node_modules/@meteor-vite/react-meteor-data/dist/index.js',
W20240504-09:51:46.367(2)? (STDERR)     'REMOVED/git/fsw-courses/.meteor/local/build/programs/server/npm-require.js',
W20240504-09:51:46.367(2)? (STDERR)     'REMOVED/git/fsw-courses/.meteor/local/build/programs/server/boot.js',
W20240504-09:51:46.367(2)? (STDERR)     'REMOVED/git/fsw-courses/.meteor/local/build/main.js'
W20240504-09:51:46.367(2)? (STDERR)   ]
W20240504-09:51:46.367(2)? (STDERR) }
W20240504-09:51:47.142(2)? (STDERR) āš”  Meteor parent process is no longer running. Shutting down...

I am trying to get a reproduction repo up in the next few days.

JorgenVatle commented 5 months ago

Hey again. Sorry I didn't have the chance to follow up until now.

Did you manage to resolve the issue? If not, I'm free for the next couple of days to have a closer look if you have a repo for me to test against. šŸ‘

malua commented 5 months ago

Thanks for you reply, unfortunately I did not have the time and I will not have the time in the forseeable future. I am going to close this for now :)