Vue Vue scaffolding framework

◆ Vue scaffolding action:

Vue Vue scaffold can quickly generate project-based architecture.

◆ Vue scaffolding installation:

npm install -g @vue/cli

◆ Use the command to create a Vue project

vue create my-project

1. Select Manually select features (select characteristics in order to create a project)
2. Check the properties can be checked by a space.
3. Whether the choice of routing historical pattern: n
4. ESLint selection: ESLint + Standard config
5. When to ESLint grammar check: Lint on save
6. How babel, postcss other configuration files are placed: In dedicated config files (configuration file used alone)
7. Whether to save as a template: n
8. Which tool to install the package: npm

◆ Create Vue project-based ui interface

Configuration Item information automatically open the project to create a web page.

vue ui

◆ Create Vue project based on the old template 2.x

npm install -g @vue/cli-init
vue init webpack my-project

◆ Vue scaffolding generated project structure

node_modules:依赖包目录
public：静态资源目录
src：源码目录
src/assets:资源目录
src/components：组件目录
src/views:视图组件目录
src/App.vue:根组件
src/main.js:入口js
src/router.js:路由js
babel.config.js:babel配置文件
.eslintrc.js:

◆ Custom Vue scaffolding configuration:

Configured through a separate configuration file, create vue.config.js

module.exports = {
    devServer:{
        port:8888,
        open:true
    }
}

Configured through package.json [not recommended]

 "vue":{
     "devServer":{
         "port":"9990",
         "open":true
     }
 }