npm安装vue
首先安装node.js安装好之后建立文件夹,用vs code打开终端
由于国内npm安装较慢,这里使用淘宝的镜像进行安装
我们可以使用淘宝的cnpm来代替默认的 npm
npm install -g cnpm --registry=https://registry.npm.taobao.org
安装完成cnpm后安装vue
cnpm install vue
命令行工具
# 全局安装 vue-cli
cnpm install --global vue-cli
# 创建一个基于 webpack 模板的新项目
vue init webpack Finance
# 这里需要进行一些配置,项目名称、说明、作者等信息
进入项目,安装并运行:
cd Finance
cnpm run dev
ok,第一部分完成!接下来引用Element的样式进行开发。
引入Element
cnpm install element-ui
接下来在main.js文件中引入
import ElementUI from 'element-ui'
import 'element-ui/lib/theme-chalk/index.css'
Vue.use(ElementUI)
测试一下,找到HelloWorld.vue,修改下内容
<i class="el-icon-edit"></i>
<i class="el-icon-share"></i>
<i class="el-icon-delete"></i>
<el-button type="primary"icon="el-icon-search">搜索</el-button>
命令行执行 npm run dev
运行看下效果
至此,我们的 vue+element 的粗略框架就搭建好了。
可以查看 ElementUI 官方文档:https://element.eleme.cn/#/zh-CN/component/container