webpack vue ElementUI Mac环境搭建

一.安装webpack

npm install -g webpack

注意：遇到报错
npm ERR! path …/lib/node_modules/webpack/bin/webpack.js
npm ERR! code EACCES
npm ERR! errno -13
npm ERR! syscall symlink
npm ERR! Error: EACCES: permission denied, symlink ‘…/lib/node_modules/webpack/bin/webpack.js’ -> ‘/usr/local/bin/webpack’
npm ERR! { Error: EACCES: permission denied, symlink ‘…/lib/node_modules/webpack/bin/webpack.js’ -> ‘/usr/local/bin/webpack’
npm ERR! cause:
npm ERR! { Error: EACCES: permission denied, symlink ‘…/lib/node_modules/webpack/bin/webpack.js’ -> ‘/usr/local/bin/webpack’
npm ERR! errno: -13,
npm ERR! code: ‘EACCES’,
npm ERR! syscall: ‘symlink’,
npm ERR! path: ‘…/lib/node_modules/webpack/bin/webpack.js’,
npm ERR! dest: ‘/usr/local/bin/webpack’ },
npm ERR! stack: ‘Error: EACCES: permission denied, symlink ‘…/lib/node_modules/webpack/bin/webpack.js’ -> ‘/usr/local/bin/webpack’’,
npm ERR! errno: -13,
npm ERR! code: ‘EACCES’,
npm ERR! syscall: ‘symlink’,
npm ERR! path: ‘…/lib/node_modules/webpack/bin/webpack.js’,
npm ERR! dest: ‘/usr/local/bin/webpack’ }
npm ERR!
npm ERR! Please try running this command again as root/Administrator.

npm ERR! A complete log of this run can be found in:
npm ERR! /Users/$USER/.npm/_logs/2019-03-16T03_43_48_222Z-debug.log
解决方案：

sudo chown -R $USER /usr/local/lib/    ($USER替换为自己的用户名)

二.安装vue-cli

npm install -g vue-cli

vue-cli 是vue.js的脚手架，用于自动生成vue.js模板工程的。

a.先cd到项目存放的目录
b.创建项目，一路回车

vue init webpack project-name  //创建一个基于webpack模板的名为project-name的项目

cd project-name
npm install
npm run dev

三.安装element-ui

在创建的项目下

npm i element-ui@next -D

使用element-ui的组件，需要先在main.js中导入

import ElementUI from 'element-ui'
import 'element-ui/lib/theme-chalk/index.css'
Vue.use(ElementUI)

四、查阅

官网：http://element-ui.cn/#/zh-CN