12

I'm trying to dockerize a frontend app which was created using vite and vue3. It is not working as a container. Here is the error response.

(!) Could not auto-determine entry point from rollupOptions or html files and there are no explicit optimizeDeps.include patterns. Skipping dependency pre-bundling.

VITE v3.2.4  ready in 191 ms

  ➜  Local:   http://localhost:5173/
  ➜  Network: http://172.17.0.2:5173/
(!) Could not auto-determine entry point from rollupOptions or html files and there are no explicit optimizeDeps.include patterns. Skipping dependency pre-bundling.

Dockerfile

# base image
FROM node:16.3.0-alpine

# set working directory
WORKDIR /app

# add `/app/node_modules/.bin` to $PATH
ENV PATH /app/node_modules/.bin:$PATH

# install and cache app dependencies
COPY package.json /app/package.json
RUN npm install
RUN npm install @vue/cli@3.7.0 -g
# start app
CMD ["npm", "run", "dev", "--", "--host", "0.0.0.0"]

vite.config.ts

export default defineConfig({
    plugins: [vue(), vueJsx()],
    resolve: {
        alias: {
            '@': fileURLToPath(new URL('./src', import.meta.url))
        }
    },
    build: {
        rollupOptions: {
            input: {
                main: resolve(__dirname, 'index.html'),
            }
        }
    }

})

index.html exist in the same directory with vite.config.ts and .Dockerfile. Thanks in advance.

krezus
  • 1,281
  • 1
  • 13
  • 29
  • 1
    i'm coming here because i had the same issue with LARAVEL + REACT + vite configuration, issue was i was playing with .js and .jsx, once i corrected that by giving same name as the file, it got resolved. – Vipertecpro Jan 29 '23 at 20:27
  • Did you inspect your container to see if your files are properly copied? Do you explicitly mount your local files on /app when you launch your container? If not, when do you plan to copy your src files in the container (nowhere found in the dockerfile)? – Maen Feb 15 '23 at 15:22
  • @Bigood Can you provide an example of copying command. this is a typcial dockerfile recommended for vue app? – krezus Feb 23 '23 at 12:11

3 Answers3

3

You are probably using the command yarn dev run instead of yarn run dev to run the dev server

Dot_Wayne
  • 47
  • 3
  • the command is `npm run dev`. any combination of the command gives an error which is related syntax. – krezus Feb 23 '23 at 12:14
  • This answer helped me in the right direction. I was accidentally using `vite run dev`, when I should be using `npm run dev` – John Apr 26 '23 at 10:56
1

This error usually occurs when your css or js files are missing from the specified folder. Like for example in your viteconfig.js file. it always look like this

   plugins: [
    laravel({
        input: [
            'resources/css/app.css',
            'resources/js/app.js',
           ],
        refresh: true,
       }),
    ],

Confirm if those files are in the right place or if you've moved them to a folder like public then you need to update here to

 plugins: [
    laravel({
        input: [
            'public/css/app.css',
            'public/js/app.js',
           ],
        refresh: true,
       }),
    ],
Kipruto
  • 721
  • 6
  • 16
0

After struggling with the same error (blindly following some tutorials), I found that I had to copy all source files to the workdir (in your case /app) instead of only package.json in the Dockerfile:

COPY . /app/

Don't forget to add node_modules to .dockerignore so they won't be copied.

Jankapunkt
  • 8,128
  • 4
  • 30
  • 59