frandiox / vite-ssr

Use Vite for server side rendering in Node
MIT License
823 stars 91 forks source link

vite-ssr build runs in development mode #199

Open MiguelDeRoudriges opened 1 year ago

MiguelDeRoudriges commented 1 year ago

Here is my package json:

{
  "name": "my-vue-app",
  "private": true,
  "version": "0.0.0",
  "scripts": {
    "dev": "vite",
    "build": "rm -rf dist && vite-ssr build",
    "start": "node ./server/index"
  },
  "dependencies": {
    "@vueuse/head": "^1.1.26",
    "compression": "^1.7.4",
    "express": "^4.18.2",
    "vite-ssr": "^0.16.0",
    "vue": "^3.2.47",
    "vue-router": "^4.1.6"
  },
  "devDependencies": {
    "@vitejs/plugin-vue": "^4.1.0",
    "vite": "^4.3.5"
  }
}

When i do npm run build and then run my express server. My application runs in development mode.

When i try to log "import.meta.env" it shows me that mode at the same time is "production" and PROD is false. How is this even possible?

{
  BASE_URL: '/',
  MODE: 'production',
  DEV: true,
  PROD: false,
  SSR: true
}
dtrethewey commented 11 months ago

I encountered the same problem as you with vite-ssr build generating a development version of the client. This is using vite 4 and vue 3.

After some hacky debugging I could generate the correct production build by adding an additional argument for defaultNodeEnv of resolveConfig.

I.e. Change this:

https://github.com/frandiox/vite-ssr/blob/50461a4e0ebf431fdd96771e069a5e759e275b6b/src/config.ts#L57-L63

to this:

export async function resolveViteConfig(mode?: string) {
  return resolveConfig(
    {},
    'build',
    mode || process.env.MODE || process.env.NODE_ENV,
    mode || process.env.MODE || process.env.NODE_ENV
  )
}

Then running NODE_ENV=production npm run build in my project (which calls vite-ssr build) I'd get the output I was expecting and not a development build with warnings etc.

I also noticed that the mode isn't being sent through to the resolveViteConfig function so not sure why that is even an argument to the function: https://github.com/frandiox/vite-ssr/blob/50461a4e0ebf431fdd96771e069a5e759e275b6b/src/build/index.ts#L24 https://github.com/frandiox/vite-ssr/blob/50461a4e0ebf431fdd96771e069a5e759e275b6b/src/config.ts#L70

I'm not sure the impacts this hack might have so best if someone with knowledge on this project and vite have a look. For now I've gotten around it in my build process (docker) by adding:

RUN sed -i "s/    return (0, vite_1.resolveConfig)({}, 'build', mode || process.env.MODE || process.env.NODE_ENV);/    return (0, vite_1.resolveConfig)({}, 'build', mode || process.env.MODE || process.env.NODE_ENV, mode || process.env.MODE || process.env.NODE_ENV);/" ./node_modules/vite-ssr/config.js

...before I call the build command :D Very hacky I know and will break after an update! I'm not using it on a professional site, so not too bothered for now. Hopefully this will help get it fixed properly in the mean time.

neSpecc commented 11 months ago

It's an unclear moment from the Vite side. You need to run the build command with NODE_ENV=production

- "build": "rm -rf dist && vite-ssr build",
+ "build": "rm -rf dist && NODE_ENV=production vite-ssr build",