mac下搭建基于vue-cli 3.0的Element UI 项目
1.安装yarn管理工具(包含node.js);
2.安装全局vue-cli全家桶:
yarn global add @vue/cli
3.创建、测试一个vue-cli项目:
vue create admin
默认会提示选择那些安装:
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 #自定义创建

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

接着是一些细化的选择,详情可以看上图,其中最后一步提示是否作为一个默认候选创建包,可以结合自己需要设定作为一个创建模板(即前面提及的project1);
4.基于vue-cli@3引入element组件
创建好项目之后,切换到目录内:
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编译、运行网站了
mac下搭建基于vue-cli 3.0的Element UI 项目的更多相关文章
- VUE CLI 3.0 安装及创建项目
一.安装 VUE CLI 3.0 官网: https://cli.vuejs.org/ 详细资料可以自己先把官网过一遍. 1. 安装(默认你的电脑上已安装node及npm) npm install ...
- 基于vue cli 3.0创建前端项目并安装cube-ui
前提条件: 安装node.js. 国内的开发者最好先配置淘宝镜像. 之后用cnpm来代替npm命令. 项目创建过程: 打开cmd,输入命令进入目标工作空间,以本机项目为例: cd /d d: cd D ...
- 基于Vue.js 2.0 + Vuex打造微信项目
一.项目简介 基于Vue + Vuex + Vue-router + Webpack 2.0打造微信界面,实现了微信聊天.搜索.点赞.通讯录(快速导航).个人中心.模拟对话.朋友圈.设置等功能. 二. ...
- vue Cli 按需引入Element UI 和全局引用Element UI
全局引用: 一.安装 Element UI npm i element-ui -S 二.在main.js 中引入 element UI import ElementUI from 'element-u ...
- Mac下搭建基于PlatformIO的嵌入式开发环境(STM32开发)
PlatformIO简介 PlatformIO是开源的物联网开发生态系统.提供跨平台的代码构建器.集成开发环境(IDE),兼容 Arduino,ESP8266和mbed等 支持在Windows.Lin ...
- vue/cli 3.0脚手架搭建
在vue 2.9.6中,搭建vue-cli脚手架的流程是这样的: 首先 全局安装vue-cli,在cmd中输入命令: npm install --global vue-cli 安装成功: 安装完成 ...
- Mac下搭建hexo3.0博客
Mac下搭建hexo3.0博客(文章同步自个人博客站点以及Github博客https://xingstarx.github.io/) window环境下搭建hexo博客 详细内容能够參考这一篇文章怎样 ...
- Mac 上搭建基于 Hexo + GitHub 个人博客
环境配置 本人电脑系统:macOS Node.js 生成静态页面.安装Node.js Git 用于将本地 Hexo 内容提交到 Github.Xcode自带Git(前提:macOS已经安装了Xcode ...
- Django + Vue cli 3.0 访问静态资源问题
[问题背景] 用Vue clie 3.0的搭建得框架把我坑死了,在打包后,调用不到静态资源js,css,mp3等 [问题原因] vue cli 3.0打包后,dist目录下没有static目录,而Dj ...
随机推荐
- CSS cursor 属性
cursor 1.定义和用法 cursor 属性规定要显示的光标的类型(形状). 该属性定义了鼠标指针放在一个元素边界范围内时所用的光标形状(不过 CSS2.1 没有定义由哪个边界确定这个范围). 2 ...
- 项目删除又重新clone,未重新进入项目目录或重启terminal,导致git命令或其他命令报 目录不存在的错误
有一点要注意的是,clone下来如果git项目文件夹被覆盖一次,需要终端cd .. 然后重新进入该目录,否则git会: fatal: Unable to read current working di ...
- 日期Date 对象常用的方法
var mydate = new Date();//通过new方法创建对象 //alert(Date()); // 返回一个完整的日期时间 // alert(mydate.getDay());//返回 ...
- Flask之session相关
Flask的session简介 除请求对象之外,还有一个 session 对象.它允许你在不同请求间存储特定用户的信息.它是在 Cookies 的基础上实现的,并且对 Cookies 进行密钥签名要使 ...
- H5开发APP入门
一.MUI MUI是一个最接近原生APP体验的高性能前端框架.我们用它来排版布局. 官方网站:http://dev.dcloud.net.cn/mui/ 二.HTML5PLUS html5+是HBul ...
- 如何制作一款HTML5 RPG游戏引擎——第一篇,地图类的实现
一,话说天下大事 前不久看到lufy的博客上,有一位朋友想要一个RPG游戏引擎,出于兴趣准备动手做一做.由于我研究lufylegend有一段时间了,对它有一定的依赖性,因此就准备将这个引擎基于lufy ...
- C语言中的extern
extern: 这个关键字真的比较恶心,在定义变量的时候,extern居然可以被省略(定义时,默认均省略): 在声明变量的时候,extern必须加在变量前. 所以有时候你搞不清楚是声明还是定义.:变量 ...
- 美化MFC 之调整静态文本的颜色 字体。 用于添加公司标题 联系方式 口号等数据
很多人都觉得自己的程序的界面不那么美观,往往VC默认产生的对话框比较单调, 因此很多人往往找到很多其它的控件对对话框进行美化修饰, 例如给静态控件设置字体,设置背景颜色等等, 其实这些完全可以由VC自 ...
- Selenium-IDE,Selenium-RC ,Selenium grid以及 Selenium-Core
Selenium-IDE,Selenium-RC ,Selenium grid 以及 Selenium-Core Selenium 是一种 Web 应用的自动测试工具,通过模拟用户对 Web 页面的各 ...
- Angular 笔记系列(二)数据绑定
数据绑定这块儿没啥说的,简单两个例子带过了. Hello World: <!DOCTYPE html> <html ng-app> <head> <title ...