从零0开始完整搭建一个VUE项目

一、安装node环境

1、下载地址为:https://nodejs.org/en/

2、检查是否安装成功:node -v 如果输出版本号,说明我们安装node环境成功。

 

npm包管理器是集成在Node.js中了,所以在安装Node.js的时候就已经自带了npm。

输入npm -v可得到npm的版本。

由于资源的限制,安装npm依赖包的时候经常失败,建议使用npm的国内镜像cnpm 命令行工具代替默认的npm。国内npm镜像https://npm.taobao.org/

3、国内npm镜像:npm install -g cnpm ––registry=https://registry.npm.taobao.org 

     检查是否安装成功:cnpm -v

 

 二、搭建vue项目环境

1、cnpm 全局安装vue-cli,输入命令:cnpm install--globalvue-cli  安装vue-cli;

  验证是否安装成功:vue,出来vue的信息,及说明安装成功;

 

上面命令不行的话,可以用下面的

C:\Windows\System32>npm install -g vue-cli
npm WARN deprecated vue-cli@2.9.6: This package has been deprecated in favour of @vue/cli
npm WARN deprecated request@2.88.2: request has been deprecated, see https://github.com/request/request/issues/3142
npm WARN deprecated coffee-script@1.12.7: CoffeeScript on NPM has moved to "coffeescript" (no hyphen)
npm WARN deprecated har-validator@5.1.5: this library is no longer supported
C:\Users\86188\AppData\Roaming\npm\vue -> C:\Users\86188\AppData\Roaming\npm\node_modules\vue-cli\bin\vue
C:\Users\86188\AppData\Roaming\npm\vue-list -> C:\Users\86188\AppData\Roaming\npm\node_modules\vue-cli\bin\vue-list
C:\Users\86188\AppData\Roaming\npm\vue-init -> C:\Users\86188\AppData\Roaming\npm\node_modules\vue-cli\bin\vue-init
+ vue-cli@2.9.6
added 236 packages from 204 contributors in 94.863s

 

创建项目

3、在本地新建FirstVueProject文件夹

 

 

4、打开命令窗口并进入该位置

 

 

接着输入:vue init webpack 然后出现以下后,输入 y(确认在当前目录下建了vue项目)

 

 

等待安装结束。。

5、安装所需依赖

 

 

6、输入npm run dev

 

 

访问地址,可见页面

 

 

 



 


版权声明:本文为anzhenxi3529原创文章,遵循CC 4.0 BY-SA版权协议,转载请附上原文出处链接和本声明。