带你实现一个网页项目从无到有，第一篇（安装软件，配置环境）

目录

 准备条件

 一、创建一个VUE项目

二、安装npm包

三、测试是否安装成功

---

 准备条件

首先下载webstorm，参考下面这篇文章，相关工具可以在链接中的地址下载。本人安装的是2022版的，照着链接来就行。

2023年最新Webstorm免费安装教程 (baidu.com)

安装nodejs,安装包也在文章顶部有，或者在官网下载，官网链接如下：

Node.js (nodejs.org)

nodejs默认安装就行，安装完成后，查看是否成功，输入如下两条命令，查看到版本信息即可。

 一、创建一个VUE项目

 1.打开webstorm,进行下面操作：file>new>project

2.左侧选择Vue.js，右边第一行是你项目存放位置，建议放在默认给的位置，在这行最后给这个项目命名，这里我项目的名称为：“xiangmu”,如下图所示，注意，项目名称建议不要是中文，不要有空格，不要有特殊字符，也不能以数字开头，否则后续写项目时会出现一堆莫名其妙的错误。

第二行，选择你node安装的位置，第三行选择“npx create-vue”,最后点击create

创建之后，就会看到，project下面有三行，此时，还没有完全创建一个vue项目

二、安装npm包

在下面选择terminal,输入：“npm i”，然后回车

然后会报如下错误，不同担心，因为我们的目的达到了，我们是为了让他出现提示框，如下下图所示，这个提示框会在右下角显示嗷，老小了，仔细看，然后点击run npm install

就会发现，工程栏那块，就变多了，并且下面图上三个红框地方都有，说明环境配置成功了

三、测试是否安装成功

 测试一下是否安装成功了，点击右上角的绿色箭头，接着会弹出一个窗口，里面有链接，点击打开，

出现网页如下，表示成功！