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 ...
随机推荐
- js foreach
array1.forEach(callbackfn[, thisArg]) 参数 定义 array1 必需. 一个数组对象. callbackfn 必需. 一个接受最多三个参数的函数. 对于数组中的每 ...
- python学习笔记(四)— 函数
一.函数是什么? 函数一词来源于数学,但编程中的「函数」概念,与数学中的函数是有很大不同的,编程中的函数在英文中也有很多不同的叫法.在BASIC中叫做subroutine(子过程或子程序),在Pasc ...
- php格式化输出数组
写网页的时候经常需要在页面中打印数组,但格式特别难看,看看一个html神器吧<pre>标签,能非常标准的显示数组格式 使用的时候只需要这样打印你的数组就OK了,太好用了,神器! echo ...
- GITLAB服务基础
1.GITLAB介绍 一个基于GIT的源码托管解决方案基于Ruby on rails开发集成了nginx postgreSQL redis sidekiq等组件 2. 资源 官网:https://ab ...
- riemann的安装和使用
Riemann monitors distributed systems. 具体介绍就不多说了,一个分布式的监控系统.可以接收各种event上报,然后通过强大的脚本和插件,展示曲线,柱状,饼图等来对系 ...
- karma安装
Last login: Sat Jun :: on ttys000 ➜ ~ cd /Users/wangyizhe/Projects/work/smartcmp/services/new-yacmp/ ...
- 详解Spark sql用户自定义函数:UDF与UDAF
UDAF = USER DEFINED AGGREGATION FUNCTION Spark sql提供了丰富的内置函数供猿友们使用,辣为何还要用户自定义函数呢?实际的业务场景可能很复杂,内置函数ho ...
- Shiro起步
1.测试环境 IntelliJ Idea 2.pom配置 <?xml version="1.0" encoding="UTF-8"?> <p ...
- 打开关闭oracle自动表分析
oracle 表的统计信息,跟他的执行计划很有关联 执行计划的正常是否,跟SQL的执行速度很有关系 首先讲解一下如何查看一个数据库的是否开启自动统计分析 1.查看参数:STATISTICS_LEV ...
- Zen-cart产品页面随机调用Wordpress文章
<?php require('./wordpress所在目录/wp-blog-header.php'); ?><?php$rand_posts = get_posts('number ...