mac下搭建基于vue-cli 3.0的Element UI 项目

1.安装yarn管理工具(包含node.js);vue

2.安装全局vue-cli全家桶:node

yarn global add @vue/cli

3.建立、测试一个vue-cli项目:vue-router

vue create admin

默认会提示选择那些安装:vuex

Vue CLI v3.3.0
? Please pick a preset: (Use arrow keys)
❯ project1 (vue-router, vuex, sass, babel, pwa, eslint) #这里是我以前建立项目并保持了他的配置(Save preset as: xxxx)
  default (babel, eslint) #默认建立,由于不太清楚它是否具有了该有的功能和组件,索引本身选择了下面自定义安装 
  Manually select features #自定义建立

自定义建立1

按空个进行勾选:vue-cli

  • Bable 预编译
  • TypeScript
  • Progressive Web App (PWA) Support 优化用的
  • Router 路由
  • Vuex
  • CSS Pre-processors CSS预处理器
  • Linter/Formatter 代码格式化
  • Unit Testing 单元测试
  • E2E Testing E2E测试

接着是一些细化的选择,详情能够看上图,其中最后一步提示是否做为一个默认候选建立包,能够结合本身须要设定做为一个建立模板(即前面说起的project1);sass

4.基于vue-cli@3引入element组件
建立好项目以后,切换到目录内:babel

vue add element

会出现如下提示:工具

? How do you want to import Element? (Use arrow keys)

为了方便,能够选择全局引用:full import单元测试

1. ? Do you wish to overwrite Element's SCSS variables? Yes
2. Choose the locale you want to load zh-CN

以后就能够经过命令yarn serve编译、运行网站了测试

相关文章
相关标签/搜索