Multiple pages based on vue-cli3.x

Versions

Multiple pages based on vue-cli3.x

based on vue-cli3.x

Multiple pages based on vue-cli2.x

based on vue-cli2.x

Company Structure

Description

Because of the update of the vue-cli, I upated my project. Thanks for the vue-cli3.x, I found that configuring the multiple pages was easier. However, since my company's structure, I added some custom settings.

1. Add a new cli : npm run site --name=[site-name], 'site-name' comes from in config/sites.config.js, default is 'dev'
2. In build/prebuild, I use the template of nginx config file (config/nginx.base.conf) to create a new configuration for production, which is deployed in docker
3. Add v-router for some entries, so these entries will become a single page with front-end router

Deploy(deploy files are not uploaded)

1. Static Files

npm run site --name=[site-name]

2. With Docker

In 'cli' folder, there are two deploy files. One is for building a docker image. The other is for deploying the docker image to production environment if the environment is accessible (can use ssh command)

cd [project]
bash ./cli/pub_docker.sh
bash ./cli/deploy.sh

Project setup

npm install

Compiles and hot-reloads for development

npm run serve

Compiles and minifies for production

npm run build

Compiles and minifies for specified site

npm run site --name=[site-name]

Compiles and minifies an UMD UI lib (imported by scripts tag)

npm run build-lib

Compiles and minifies components with UMD style (import a single component by scripts tag)

npm run build-all

Compiles and minifies an icon lib (imported by scripts tag)

npm run build-icons

Run your tests

npm run test

Lints and fixes files

npm run lint

TODO List

• [x] add a demo
• [x] add a image for company structure
• [x] remove unuseful file in demo
• [x] using Chinese
• [x] modify my english syntax
• [x] more detail