vue项目搭建
之前自己有用vue写过一些demo，但是都是基于jquery直接引入js文件写的，这次因为项目需要，自己搭建一套vue的系统，感觉还是受益良多，查了很多文档跟api，有不足之处欢迎指正！
1、node.js 以及npm
官网直接下载安装(nodejs一般都会自带npm)
测试：打开命令行 node -v
测试：npm -v
如果版本太低可以通过：npm install -g npm进行升级
2、cnpm（淘宝镜像，下载会快一些）
npm install -g cnpm –registry=https://registry.npm.taobao.org
测试:cnpm –v
3、webpack（全局安装）
cnpm install webpack -g
4、vue（全局安装）
npm install vue -cli -g
5、 新建项目（新的项目创建过程）
在硬盘上找一个文件夹放工程用的，在终端中进入该目录
vue init webpack-simple 工程名字<工程名字不能用中文>，
或vue init webpack 工程名字<工程名字不能用中文>
执行后可填写 也可一路回车 默认选项
会有一些初始化的设置，如下输入:
Project name (vue-test)直接回车默认
Project description (A Vue.js project) 直接回车默认
Author 写你自己的名字
Use sass 大家可以根据自己的需求选择yes or no
6、启动项目
cd 到项目目录文件夹 npm install 安装依赖包
npm run dev 启动项目 端口号随机 也可以自己更改
npm run build 构建文件打包
7、安装element-ui
进入项目目录 执行 npm i [email protected] –D,
在入口文件main.js中引入
import ElementUI from ‘element-ui’
import ‘element-ui/lib/theme-chalk/index.css’
Vue.use(ElementUI)
在这里看了很多文章有直接引入themen-default/index.css的，可以在node_moudles里面找到element-ui/lib/目录，看一下里面是哪个文件在引入
8、项目文件解析
src目录下可以根据自己项目需求自己新建
/build 构建脚本目录
/config 构建配置目录
/dist 打包后生成的目录
/node_modules 依赖包
/src 源码目录
/assets 资源目录（图片 图标等）
/components 组件目录（本项目可提取出共用的组件）
/router 路由目录（处理跳转等）
/styles 样式目录
/views 页面目录
/service 页面请求目录
/utils 工具类文件
App.vue 页面级组件（共用的一些头部、底部、左侧菜单）
Home.vue 页面级组件（共用的一些头部、底部、左侧菜单）
Main.js 入口文件
/static 静态文件目录
/test 测试文件目录
.eslinetrc.js es静态检查目录
.eslinetignore 配置不需要今天检查目录
Index.html 入口页面
Packge.json 项目描述文件
以上是 vue项目搭建 的全部内容， 来源链接： utcz.com/z/376730.html
