Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Proposal: Simpler way to bundle Node apps with Vite #87

Open
srmagura opened this issue May 3, 2023 · 1 comment
Open

Proposal: Simpler way to bundle Node apps with Vite #87

srmagura opened this issue May 3, 2023 · 1 comment

Comments

@srmagura
Copy link

srmagura commented May 3, 2023

Thank you for this library. It works well until you try to add WebSockets to your application. To fix this problem, I propose that we either create a new major version of vite-plugin-node or (more likely) create a new library that borrows some from vite-plugin-node.

Downsides to vite-plugin-node

  1. WebSockets do not work (Websockets do not work #22, NestJS, SocketIO not working #71)
  2. The Node application does not start up until you make a request to it (Node Server doesn't start automatically #85). Inconvenient because:
    • You might just want to test that the server starts up without crashing
    • Starting the server may have side effects (like outputting a GraphQL schema), which you want to run immediately
  3. vite-plugin-node has code to integrate with specific server frameworks like Express and NestJS
    • Ideally, the build system should work for any server framework (no framework-specific code)

The simpler way

All of the above issues stem from vite-plugin-node being intertwined with your Node application at runtime. We can fix all of the above by using Vite as a build tool only.

High-level steps when running your application in development:

  • Run Vite in watch mode: vite build --mode development --watch. It creates dist/main.js when the initial compilation finishes.
  • Run your application with Node: node dist/main.js
  • When you change your code, Vite rebuilds and updates main.js. This should trigger the application to restart. (You can use nodemon)

Rough implementation

Here is an unpolished implementation of the above strategy.

start script in package.json:

"scripts": {
    "start": "rimraf dist && concurrently \"vite build --mode development --watch\" \"node scripts/wait-for-build.mjs && nodemon dist/main.js\""
  },

wait-for-build.mjs:

// This script is used by `yarn start`.
//
// The script runs until `dist/main.js` is created by Vite, and then it exits.

import chokidar from 'chokidar';

chokidar.watch('dist').on('all', (event, path) => {
  if (event === 'add' && path === 'dist/main.js') {
    process.exit(0);
  }
});

To use this, you'll need to run: npm install --save-dev rimraf concurrently nodemon chokidar

Idea for cleaner implementation

The idea is to package the above "rough implementation" into a library. I think the library would have a CLI tool, and maybe a Vite plugin based off of vite-plugin-node. I would be interested in creating such a library if other people think they would use it.

@nick4fake
Copy link

nick4fake commented Jun 12, 2023

Wow, this is perfect! I've been fighting with those issues for quite a while before noticing this, it simply works.

I'll try to think about a PR

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants