前端项目构建

1.项目构建前置

        本人现在用的配置是node.js+vscode。

2.现在配置好环境变量之后，查看node版本

node -v

我的是：v16.13.1

查看npm版本

npm -V

我的是：npm@8.1.2 D:\tool\study_tool\node\node_modules\npm

3.设置淘宝镜像，就和maven仓库，由于某些原因，直接访问原始镜像访问不到的话，可以通过访问国内镜像可以加快我们下包的速度。

npm config set registry https://registry.npm.taobao.org

通过这个语句可以查看当前的镜像仓库

npm config get registry

4.安装vue-cli

官网：Vue CLI

-g是全局安装的意思 global

npm install -g @vue/cli

通过命令查看安装的vue-cli版本

vue -V

如果报错

请参考：管理端cmd运行：set-ExecutionPolicy RemoteSigned  

并选择：Y

vue : 无法加载文件 C:\Users\1111111\AppData\Roaming\npm\vue.ps1,因为在此系统禁止运行脚本_wqnmlgbsz的博客-CSDN博客

5.创建新的vue项目

选择一个你想创建项目的文件夹，使用命令创建：

vue create market-potato（项目名，自定义）

6.详细步骤

 6.1手动构建vue项目

default是默认方式，新手可以使用。

选择手动，Manually select features

choose Vue version，选择vue版本，不选择则使用vue3

Babel，选

TypeScript 使用TypeScript写，不选

Progress Web App（PWA） Support 不选

Router 选

Vuex

CSS Pre-processors

Linter Testing

Unit Testing

E2E Testing

详细可参考：使用vue创建项目的详细步骤_幸运小男神的博客-CSDN博客_创建vue项目的步骤

6.2我的手动如图

 7.等待几分钟，安装成功之后出现就说明可以了

8使用命令 npm run serve就可以运行

 可以访问即可