vue-cli 4.2

  1. 创建项目
    1. 使用vue create 项目名创建
      1. 第一步
      2. 第二步
      3. 第三步
      4. 第四步
      5. 第五步
  2. 路由引入组件
    1. vue cli 2的方式
    2. 使用ES6用法

创建项目

使用vue create 项目名创建

第一步

第一步

选项 意义
default (babel, eslint) 默认配置
Manually select features 自定义配置

假如选择第二个 Manually select features

第二步

第二步
按空格选择需要的,回车

第三步

第三步
是否使用history模式的router,即url要不要带’#’

第四步

第四步
配置放在哪里

第五步

第五步
是否保存为预选项,即可以在第一步中直接选择完事.

路由引入组件

在router下的index.js中配置

vue cli 2的方式

// 引入Home组件
import Home from '../views/Home.vue'
const routes = [
  {
    path: '/',
    name: 'Home',
    component: Home
  }
]

使用ES6用法

const routes = [
 {
    path: '/about',
    name: 'About',
// import中写组件的路径
    component: () => import( '../views/About.vue')
  }
]

作者: 忞翛

出处: https://www.lczmx.top/VUE/d52996071f5d/

版权: 本作品采用「署名-非商业性使用-相同方式共享 4.0 国际」许可协议进行许可。

转载请注明来源,欢迎对文章中的引用来源进行考证,欢迎指出任何有错误或不够清晰的表达。

在线工具