Vue项目环境搭建

项目环境安装

一、学习Vue

点击进入Vue官网：https://cn.vuejs.org/

二、工具Node.js安装

（1）打开官方网站：https://nodejs.org/en/

（2）选择对应的node版本进行下载

（3）安装node.js后，进行版本检查

三、使用VsCode开发工具新建Vue项目

（1）新建项目文件夹，名字为:MyShop

（2）选中文件夹，反键使用VsCode打开项目

（3）使用ctrl+~打开终端命令

（4）使用淘宝镜像执行cnpm命令

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

​ 注：因为npm是国外的服务，用起来比较卡。需要换成淘宝的cnpm

（5）全局安装vue脚手架 cnpm install -g vue-cli

​ 会提示一下报错：

​ 解决办法如下：

1. 管理员身份打开powerShell

   

2. 输入set-ExecutionPolicy RemoteSigned ，回车

3. 输入Y，回车

   

4. 再次安装vue脚手架

   cnpm install -g vue-cli

   

（6）全局安装webpack

​ cnpm install -g webpack

​ 注意：第一次安装时，步骤不能乱，一定不能乱！

（7）新建项目

​ vue init webpack +项目名

注意：项目名字一定要小写，大写会报错

（8）安装图解

注意：ESlint(严选模式)一定要选NO，否则心态爆炸！

（9）执行cnpm命令

​ cnpm install

注意：必须执行此命令，要不然一直会报错

（10）运行项目 npm run serve