vue 开发环境搭建
安装 nodejs
- 官网下载安装包,直接 下一步 即可
- https://nodejs.org/en/
安装 vue-cli
npm install -g vue-cli
创建vue项目
vue init webpack vue_demo
webpack 类似 java 中的 maven
创建好的 vue 项目是可以直接运行的
运行vue项目
npm run dev
或
npm start
下载安装依赖
npm install
--verbose 命令,来查看运行细节:
npm install --verbose
根据package.json文件
项目打包
- 直接使用下面命令,就可以把vue项目打包:
npm run build
Webpack下的Vuejs项目文件结构
▸ build/ // 编译用到的脚本
▸ config/ // 各种配置
▸ dist/ // 打包后的文件夹
▸ node_modules/ // node第三方包
▸ src/ // 源代码
▸ static/ // 静态文件, 暂时无用
▸ index.html // 最外层文件
▸ package.json // node项目配置文件
Vue 扩展插件
- vue-cli:vue 脚手架
- vue-resource(axios):ajax 请求
- vue-router: 路由
- vuex: 状态管理
- vue-lazyload: 图片懒加载
- vue-scroller: 页面滑动相关
- mint-ui: 基于 vue 的 UI 组件库(移动端)
- element-ui: 基于 vue 的 UI 组件库(PC 端)
常用第三方库安装
npm install stylus stylus-loader -D
npm install axios --save