搭建Vue项目

检查环境 node 和 npm

E:\VueProject\XXXX-ui>node -v
v12.13.1

E:\VueProject\XXXX-ui>npm -v
6.14.7

搭建vue项目环境

查看所有全局安装的模块

E:\VueProject\xxxxxx>npm list -g
C:\Users\Administrator\AppData\Roaming\npm
+-- @vue/cli@4.5.6
| +-- @types/ejs@2.7.0
| +-- @types/inquirer@6.5.0
| | +-- @types/through@0.0.30

全局安装vue-cli

E:\VueProject\xxxxxx>npm install --global vue-cli

进入项目目录，创建一个基于 webpack 模板的新项目

vue init webpack 项目名

E:\VueProject\wenhua-ui>vue init webpack xxxxxx-ui

? Project name  工程名  
? Project description 描述
? Author xxxxxx <xxxxxxxx@qq.com> 作者
? Vue build standalone
? Install vue-router? Yes  是否安装 vue-router
? Use ESLint to lint your code? Yes  是否安装 ESLint(可组装JavaScript和JSX检查工具) 
? Pick an ESLint preset Standard
? Set up unit tests Yes
? Pick a test runner noTest
? Setup e2e tests with Nightwatch? Yes
? Should we run `npm install` for you after the project has been created? (recommended) npm

   vue-cli · Generated "xxxxxxx-ui".


# Installing project dependencies ...
# ========================

等待下载依赖…

下载完后目录是这样

安装依赖

安装依赖

npm install

建议不要直接使用 cnpm 安装依赖，会有各种诡异的 bug。可以通过如下操作解决 npm 下载速度慢的问题

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

耐心等待安装依赖，安装完成后

运行项目

E:\VueProject\wenhua-ui\wenhua-ui>npm run dev
......
 I  Your application is running here: http://localhost:8080

浏览器访问http://localhost:8080

成功运行！
开始写你的代码吧！