Vue环境搭建

小鱼儿 2022-12-02 12:27 145阅读 0赞

## 关于vue安装的步骤总结 ##

1.  安装node.js [点击去下载][Link 1]（直接安装即可，无注意事项）
2.  打开cmd（Windows+R），检测node是否安装成功  
    安装完node.js之后，npm也会自动安装  
    查询是否安装成功的命令：  
    node -v  
    npm -v  
    ![在这里插入图片描述][20200830220519593.png_pic_center]
3.  npm下载较慢，可先安装淘宝npm（cnpm）
    
    命令：npm install -g cnpm --registry=https://registry.npm.taobao.org  
    查看是否安装成功命令：cnpm -v  
    ![cnpm查询成功的截图][cnpm]
4.  安装全局webpack  
    在命令行里输入：npm install webpack -g （C盘）（cnpm install webpack -g ）进行全局安装：  
    ![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80NjAyNTM3MQ_size_16_color_FFFFFF_t_70_pic_center]
5.  安装vue-cli脚手架工具  
    在命令行里输入：npm install -g vue-cli （C盘）(cnpm install -g vue-cli )进行全局安装:  
    输入：vue，回车，如果出现vue信息说明安装成功  
    ![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80NjAyNTM3MQ_size_16_color_FFFFFF_t_70_pic_center 1]
6.  cd到工程目录
7.  创建项目：vue init webpack 工程名<工程名字不能用中文>
8.  安装项目依赖：npm install （安装会很慢，从国内cnpm下载的话会少很多依赖库）
9.  安装 vue 路由模块vue-router和网络请求模块vue-resource：cnpm install vue-router vue-resource --save  
    其他如 （安装elementui：npm install element-ui --save  
    安装vue的gridster：npm install vue-power-drag  
    安装echarts：npm install echarts -S  
    安装axios惊醒HTTP请求：npm install axios）等等
10. 启动项目：npm run dev

*！一些注意事项：有时候vue-cli的版本过旧会出现报错，需要更新vue-cli  
\------- 命令：npm update vue-cli  
查看当前全局 vue-cli 的版本命令：npm view vue-cli*

[Link 1]: http://nodejs.cn/download/
[20200830220519593.png_pic_center]: /images/20221123/0adeced80fae40a6858c6c159a9de695.png
[cnpm]: /images/20221123/bba595eb0d2e4075a10add24a24b6b02.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80NjAyNTM3MQ_size_16_color_FFFFFF_t_70_pic_center]: /images/20221123/da7359bc742340c3a93debf067eee18e.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3dlaXhpbl80NjAyNTM3MQ_size_16_color_FFFFFF_t_70_pic_center 1]: /images/20221123/673fb5d9c48f4d2eb97ceedffa8e6f9a.png