lhapaipai / vite-plugin-symfony

Vite plugin to use your bundler with Symfony
https://symfony-vite.pentatrion.com
Other
43 stars 11 forks source link

SSR Build doesn't resolve packages from node_modules #19

Closed secondmanveran closed 4 months ago

secondmanveran commented 1 year ago

When trying to build my ssr files the script can't resolve packages.

vite v4.3.5 building SSR bundle for production...
✓ 5 modules transformed.
rendering chunks (3)...[symfony] Unable to find vue
✓ built in 223ms
error during build:
Error: Unable to find vue
    at resolveEntrypoint (/Users/vince/Sites/symfony/zuma/node_modules/vite-plugin-symfony/dist/index.js:177:15)
    at addBuildEntryPoints (/Users/vince/Sites/symfony/zuma/node_modules/vite-plugin-symfony/dist/index.js:144:37)
    at Object.generateBundle (/Users/vince/Sites/symfony/zuma/node_modules/vite-plugin-symfony/dist/index.js:420:7)
    at file:///Users/vince/Sites/symfony/zuma/node_modules/rollup/dist/es/shared/node-entry.js:24551:40
    at process.processTicksAndRejections (node:internal/process/task_queues:95:5)

This is happening for vue @vue @inertiajs axios form-data ... and that's where I stopped adding aliases.

I'm using this package: https://github.com/cydrickn/sviv

This is my vite config:

import { defineConfig, loadEnv } from 'vite'
import symfonyPlugin from 'vite-plugin-symfony'
import Vue from '@vitejs/plugin-vue'

export default defineConfig(({ mode }) => {
  const env = loadEnv(mode, process.cwd())

  return {
    plugins: [
      Vue({
        include: [/\.vue$/, /\.md$/],
        template: {
          transformAssetUrls: {
            base: null,
            includeAbsolute: false
          }
        }
      }),
      symfonyPlugin({
        publicDirectory: 'public',
        buildDirectory: 'build'
      })
    ],
    root: '.',
    publicDir: false,
    build: {
      rollupOptions: {
        input: {
          app: './assets/app.js',
          theme: './assets/app.css'
        }
      },
      server: {
        port: 13714
      }
    }
  }
})

And this is the vite.ssr.config.js:

import config from './vite.config.js'
/**
 * @type {import('vite').UserConfig}
 */
export default Object.assign(config, {
  ssr: {
    noExternal: /./
  },
  resolve: {
    // necessary because vue.ssrUtils is only exported on cjs modules
    alias: [
      {
        find: '@vue/runtime-dom',
        replacement: '@vue/runtime-dom/dist/runtime-dom.cjs.js'
      },
      {
        find: '@vue/runtime-core',
        replacement: '@vue/runtime-core/dist/runtime-core.cjs.js'
      }
    ]
  },
  optimizeDeps: {
    // exclude: ['example-external-component']
  }
})

Is there something I'm missing? I use Vite all the time with Laravel, but this is my first time integrating it in Symfony.

lhapaipai commented 1 year ago

hi @secondmanveran, I'm not sure to understand how to fix your issue. but I can give you some advices. I think you need to specify another directory for your ssr build otherwise the ssr build will overwrite you're other build. for that you need to specify your config with vite base and build.outdir (not with vite-plugin-symfony : buildDirectory / publicDirectory)

https://github.com/lhapaipai/vite-plugin-symfony/blob/e91e7672f0fa9c07b67cad9796c0546840e0d198/src/index.ts#L55

after that can you disable vite-plugin-symfony and show your manifest.json generated for your 2 builds ? I can get a better idea of the issue.

Finally can you confirm that you encounter the same issue with the version 3.3.2 ?

lhapaipai commented 5 months ago

hi @secondmanveran, have you tried my solution? otherwise I will close the ticket because it cannot be resolved without further details. do not hesitate to reopen it if you have additional elements to bring