Error: Cannot find module '../../../../dist/server/importBuild.cjs'

[iMrDJAi]

Description

After building server code with Vavite, then copying node_modules into server/node_modules, VPS was unable to locate the project root.

With a quick search, I see that relative paths are hardcoded in the plugin code, without taking into account the possibility of building server code, changing node_modules location or using /dist standalone (e.g. copying /dist/client and /dist/server to the project root).

Error Message + Error Stack

Error: Cannot find module '../../../../dist/server/importBuild.cjs'
Require stack:
 - /usr/src/app/dist/server/node_modules/@brillout/vite-plugin-import-build/dist/autoImporter.js
 - /usr/src/app/dist/server/node_modules/@brillout/vite-plugin-import-build/dist/loadBuild/index.js
 - /usr/src/app/dist/server/node_modules/@brillout/vite-plugin-import-build/loadBuild.js
 - /usr/src/app/dist/server/node_modules/vite-plugin-ssr/dist/cjs/node/plugin/plugins/importBuild/loadBuild.js
 - /usr/src/app/dist/server/node_modules/vite-plugin-ssr/dist/cjs/node/runtime/globalContext.js
 - /usr/src/app/dist/server/node_modules/vite-plugin-ssr/dist/cjs/node/runtime/html/injectAssets/getViteDevScripts.js
 - /usr/src/app/dist/server/node_modules/vite-plugin-ssr/dist/cjs/node/runtime/html/injectAssets/getHtmlTags.js
 - /usr/src/app/dist/server/node_modules/vite-plugin-ssr/dist/cjs/node/runtime/html/injectAssets.js
 - /usr/src/app/dist/server/node_modules/vite-plugin-ssr/dist/cjs/node/runtime/html/renderHtml.js
 - /usr/src/app/dist/server/node_modules/vite-plugin-ssr/dist/cjs/node/runtime/renderPage/renderPageContext.js
 - /usr/src/app/dist/server/node_modules/vite-plugin-ssr/dist/cjs/node/runtime/renderPage.js
 - /usr/src/app/dist/server/node_modules/vite-plugin-ssr/dist/cjs/node/index.js
 - /usr/src/app/dist/server/index.js
at Function.Module._resolveFilename (node:internal/modules/cjs/loader:995:15)
at Function.Module._load (node:internal/modules/cjs/loader:841:27)
at Module.require (node:internal/modules/cjs/loader:1067:19)
at require (node:internal/modules/cjs/helpers:103:18)
at Object.exports.load (/usr/src/app/dist/server/node_modules/@brillout/vite-plugin-import-build/dist/autoImporter.js:2:24)
at loadBuild (/usr/src/app/dist/server/node_modules/@brillout/vite-plugin-import-build/dist/loadBuild/index.js:15:18)
at loadBuild (/usr/src/app/dist/server/node_modules/vite-plugin-ssr/dist/cjs/node/plugin/plugins/importBuild/loadBuild.js:15:72)
at initGlobalContext (/usr/src/app/dist/server/node_modules/vite-plugin-ssr/dist/cjs/node/runtime/globalContext.js:36:62)
at Object.renderPage (/usr/src/app/dist/server/node_modules/vite-plugin-ssr/dist/cjs/node/runtime/renderPage.js:22:53)
at /usr/src/app/dist/server/index.js:2:3009

[brillout]

I'll need a reproduction.

[iMrDJAi]

@brillout reproduction:
Fork https://stackblitz.com/github/cyco130/vavite/tree/main/examples/vite-plugin-ssr.
Run npm run build from stackblitz terminal.
Run mv node_modules ./dist/server.
Run cd dist then node server.
Refresh the page and the error appears.
Actually the error is diffrent on vite-plugin-ssr@0.4.77, the one I've posted is from v0.4.3.

Error: [vite-plugin-ssr@0.4.77][Wrong Usage] Cannot find production build. Did you to run `$ vite build`? If you did, then you may need to use `importBuild.cjs`, see https://vite-plugin-ssr.com/importBuild.cjs
    at loadBuild (file:///home/projects/github-g7kwqi/dist/server/node_modules/vite-plugin-ssr/dist/cjs/node/plugin/plugins/importBuild/loadBuild.js:16:33)
    at async initGlobalContext (file:///home/projects/github-g7kwqi/dist/server/node_modules/vite-plugin-ssr/dist/cjs/node/runtime/globalContext.js:36:30)
    at async Module.renderPage (file:///home/projects/github-g7kwqi/dist/server/node_modules/vite-plugin-ssr/dist/cjs/node/runtime/renderPage.js:22:9)
    at async eval (file://file:///home/projects/github-g7kwqi/dist/server/index.js:24:25)

[brillout]

Follow https://vite-plugin-ssr.com/importBuild.cjs.

[iMrDJAi]

@brillout It seems like that file is pointing to the wrong place:

{
  const { setLoaders } = require('../../node_modules/vite-plugin-ssr/dist/cjs/node/plugin/plugins/importBuild/loadBuild.js');
  setLoaders({
    pageFiles: () => import('./pageFiles.js'),
    clientManifest: () => require('../client/manifest.json'),
    pluginManifest: () => require('../client/vite-plugin-ssr.json'),
  });
}

After moving node_modules, the path to loadBuild.js will no longer be valid.

[brillout]

VPS assumes that you don't move node_modules. If you can't work around that, feel free to elaborate a convincing story why VPS should be more flexible in that regard.

[iMrDJAi]

@brillout Since the webpack era, the /dist directory used to include a standalone working build of web applications with no need for the source code (in this case maintaining the same structure as it was in the development phase). Actually, the ultimate goal would be removing the need of a node_modules folder.

For reference I have opened an issue in vavite regarding this (cyco130/vavite#24).

[brillout]

https://vitejs.dev/config/ssr-options.html#ssr-noexternal

[iMrDJAi]

@brillout Well, I see from #403 that it won't work if we want to bundle all the server code into a single file.

One of my dreams is being able to have a truly standalone server build with Vite, just like it used to be with Webpack, this would be the ultimate Vite setup! Well, I see that it still too early for that, maybe in the future the community will go in that direction.

[brillout]

Using importBuild.cjs should allow you to do that.