Vue环境搭建以及学习文档

1. 安装nodejs
https://nodejs.org/en/download/current/
npm自我更新:npm install -g npm

2. 配置npm持久使用淘宝镜像
npm config set registry https://registry.npm.taobao.org
npm config get registry

3. 安装vue-cli
npm install vue-cli -g

4. 创建示例项目
vue init webpack vuehelloworld
--------------------------------------------
? Project name vuehelloworld
? Project description A Vue.js project
? Author
? Vue build (Use arrow keys)
? Vue build standalone
? Install vue-router? Yes
? Use ESLint to lint your code? No
? Set up unit tests No
? Setup e2e tests with Nightwatch? No
? Should we run `npm install` for you after the p
? Should we run `npm install` for you after the p
---------------------------------------------------


5. 项目导入到idea
Javascript语言设置为es6
webpack配置文件路径修改
  setting搜索webpack
  C:\Users\luck\vuehelloworld\build\webpack.base.conf.js
vue扩展名打开方式设置为html编辑器

6. 安装依赖
集成element-ui:http://element-cn.eleme.io/#/zh-CN/component/installation
安装axios:npm install axios -S
重新安装项目依赖的模块:npm i

7. 运行项目(dev模式)
npm run dev

8. vue chrome插件
https://github.com/vuejs/vue-devtools

9. 打包项目
npm run build

简易静态文件服务器
npm install http-server -g

10. 参考资料:
vue学习(官方):https://cn.vuejs.org/v2/guide/
vue-router(官方):https://router.vuejs.org/zh/
es6学习(阮一峰的博客):http://es6.ruanyifeng.com/
element-ui组件(官方):http://element-cn.eleme.io/#/zh-CN/component/installation
 

扫描二维码关注公众号,回复: 2335639 查看本文章

猜你喜欢

转载自blog.csdn.net/weixin_41722928/article/details/81130697