Which command do I use to generate the build of a Vue app?

Question

I think you've created your project like this:

vue init webpack myproject

Well, now you can run

npm run build

Copy index.html and /dist/ folder into your website root directory. Done.

If you've created your project using:

vue init webpack myproject

You'd need to set your NODE_ENV to production and run, because the project has web pack configured for both development and production:

NODE_ENV=production npm run build

Copy dist/ directory into your website root directory.

If you're deploying with Docker, you'd need an express server, serving the dist/ directory.

Dockerfile

FROM node:carbon

RUN mkdir -p /usr/src/app

WORKDIR /usr/src/app
ADD . /usr/src/app
RUN npm install

ENV NODE_ENV=production

RUN npm run build

# Remove unused directories
RUN rm -rf ./src
RUN rm -rf ./build

# Port to expose
EXPOSE 8080
CMD [ "npm", "start" ]

in your terminal

npm run build

and you host the dist folder. for more see this video

If you run into problems with your path, maybe you need to change the assetPublicPath in your config/index.js file to your sub-directory:

http://vuejs-templates.github.io/webpack/backend.html

To deploy your application to prod environment add

"build": "vue-cli-service build --mode prod"

in your scripts in package.json file.

Open your main.js and add

Vue.config.productionTip = false;

right after your imports. Then open your cli in the project folder and run this command

npm run build

This will make a dist folder in your project directory you may upload that dist folder in your host and your website will be live