I tried to dockerize a basic VueJS app. I'm using Vite and I kept the basic files automatically generated when I wrote npm init vite@latest client
in the terminal.
When I run npm run dev
I can see everything is OK on http://localhost:5173
, and when I run npm run build
the files generated in the dist
folder are correct.
Although, when I dockerize this app, I have an error. Here is the Dockerfile:
# Build env
FROM node:lts-alpine as build-npm-stage
WORKDIR /cno-vue
COPY package*.json ./
RUN npm install
COPY index.html ./
COPY public ./public
COPY src ./src
COPY .env.production ./
RUN npm run build
# Run env
FROM nginx:stable-alpine
COPY --from=build-npm-stage /cno-vue/dist /usr/share/nginx/html
COPY nginx.conf /etc/nginx/conf.d/default.conf
EXPOSE 80
ENTRYPOINT ["nginx", "-g", "daemon off;"]
And here is what I write in the terminal:
docker build --tag cesar/cno-client .
Here is the error I get in the console:
Step 10/15 : RUN npm run build
---> Running in 19b4ced0dc36
> [email protected] build
> vite build
vite v3.2.3 building for production...
transforming...
✓ 4 modules transformed.
[vite:build-import-analysis] Parse error @:9:10
file: /cno-vue/src/App.vue:14:0
12: <div>
13: <a href="https://vitejs.dev" target="_blank">
14: <img src="/vite.svg" alt="Vite logo" />
^
15: </a>
16: <a href="https://vuejs.org/" target="_blank">
error during build:
Error: Parse error @:9:10
at parse$b (file:///cno-vue/node_modules/vite/dist/node/chunks/dep-51c4f80a.js:32639:355)
at Object.transform (file:///cno-vue/node_modules/vite/dist/node/chunks/dep-51c4f80a.js:42077:27)
The command '/bin/sh -c npm run build' returned a non-zero code: 1
I don't see any parsing error... Could somebody explain what did go wrong?
If I delete the incriminated line, I have the same error on another random line...
CodePudding user response:
OK I forgot to copy Vite's conf. I simply had to add:
COPY vite.config.js ./