vue环境搭建

绝地灬酷狼 2022-12-11 12:19 252阅读 0赞

### vue环境搭建 ###

*   *   *  安装node：
         *   *  判断有没有装node
             *  npm包管理器，集成在node中（不用安装）：
             *  npm的国内镜像---cnpm。
         *  配置环境变量
         *   *  1.判断node地址：
             *  2.path
             *  3.NODE\_PATH：
         *  安装VUE
         *   *  安装vue-cli脚手架构建工具
         *  项目启动
         *   *  命令行进入项目的路径!\[在这里插入图片描述\](https://img-blog.csdnimg.cn/20201001082936600.png\#pic\_center)
             *  下载项目依赖包：
             *  本地启动
         *  如果运行出现npm ERR! missing script: dev
         *   *  原因：
             *  解决办法：

### 安装node： ###

[官网][Link 1]

#### 判断有没有装node ####

![在这里插入图片描述][20200930171245316.png_pic_center]

#### npm包管理器，集成在node中（不用安装）： ####

![在这里插入图片描述][20200930171350774.png_pic_center]

#### npm的国内镜像—cnpm。 ####

npm install -g cnpm --registry=https://registry.npm.taobao.org

因为：npm有些资源被屏蔽或者是国外资源的原因。经常导致用npm安装依赖包的时候失败，所以需要安装国内镜像。

### 配置环境变量 ###

#### 1.判断node地址： ####

![在这里插入图片描述][20200930173114843.png_pic_center]

#### 2.path ####

![在这里插入图片描述][watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L0NpZWxfWQ_size_16_color_FFFFFF_t_70_pic_center]

#### 3.NODE\_PATH： ####

![在这里插入图片描述][20200930173543145.png_pic_center]

### 安装VUE ###

npm install vue -g

\-g是指安装到node\_global全局目录去（在命令提示符中安装。）

#### 安装vue-cli脚手架构建工具 ####

cnpm install -g vue-cli

(注意，这里使用cnpm来替代npm，不然速度超级慢，会导致卡在那)

### 项目启动 ###

#### 命令行进入项目的路径![在这里插入图片描述][20201001082936600.png_pic_center] ####

#### 下载项目依赖包： ####

npm install

#### 本地启动 ####

npm run dev

### 如果运行出现npm ERR! missing script: dev ###

![在这里插入图片描述][20201001083029426.png_pic_center]

#### 原因： ####

npm在拉取的时候出错了，删除文件重现拉取就行。

#### 解决办法： ####

到项目文件夹中将node\_modules删除，再执行npm install，npm run dev。再出现上述问题，就重复执行，多执行几次，总会成功的。

[Link 1]: https://nodejs.org/en/download/
[20200930171245316.png_pic_center]: /images/20221123/1d8d53074b0c417da7cc5a7c2fc96e1c.png
[20200930171350774.png_pic_center]: /images/20221123/aa341d2d75fb4e328d2782651158131c.png
[20200930173114843.png_pic_center]: /images/20221123/1570cfe9b7fb494e9c4d23c86df4dac0.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L0NpZWxfWQ_size_16_color_FFFFFF_t_70_pic_center]: /images/20221123/a949a348fb6648bfb00975d8e004c8ac.png
[20200930173543145.png_pic_center]: /images/20221123/f6e132e3cbb443f6ac891579235d9e60.png
[20201001082936600.png_pic_center]: /images/20221123/8c98cc953310485b8b6c2e18adecf367.png
[20201001083029426.png_pic_center]: /images/20221123/e113325e0ba44e208e6f544fa9f843d4.png