1.首先新建一个空的项目文件夹：【yydpt_vue2_base】
如下图：
图1
2.然后用【vscode】打开此项目文件
如下图：
图2
3.因为此项目准备用【vue2+webpack】来进行前端开发，因此可以先安装【webpack】这个项目打包工具；
以下是详细步骤地址：
webpack的安装步骤及文件（1）
https://yydpt.blog.csdn.net/article/details/124505511?spm=1001.2014.3001.5502
这里就不过多的解释了，直接新建终端，然后在终端中输入：【npm init】
然后会出现 package name(打包工具名称)、version(版本)、description(描述) 等等的包信息；
这里可以根据自己的项目来填写，也可以直接按 【Enter】 默认设置；
直到出现 Is this ok?（yes），这是输入 【yes】 之后点击 【Enter】 项目文件夹里面就会出现 package.json 文件了；
如下图：
图3
图片的左边，也就是刚刚新建的空项目之中就多了一个 package.json 的文件，而文件的初始内容如下：
{
"name": "yydpt_vue2_base",
"version": "1.0.0",
"description": "",
"main": "index.js",
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1"
},
"author": "",
"license": "ISC"
}
4.接着在终端中输入：【npm install vue@2】，安装的是vue2.7.0的版本
vue的网站中目前写的最新稳定版本是：【2.6.14】
这个版本可以根据自己实际的情况去下载安装就可以了；
如下图：
图4
就像图4之中，终端输入 npm install vue@2 之后，显示安装了 vue 的 2.7.0 版本，并且在 package.json 文件中内容对象之中也加上了
"dependencies": {
"vue": "^2.7.0"
}【dependencies】： 表示的是发布环境需要的依赖项的属性；
【devDependencies】：表示的是本地环境开发时候所所需要的依赖项放；
因为现在是在本地开发，因此需要在项目中的 package.json 中加上该属性和vue，
如下图：
图5
而项目文件中因为终端输入 npm install vue@2 之后多出了 node_modules 文件夹和 package-lock.json 文件，
【node_modules】：里面存放着项目中所需要的依赖项；
【package-lock.json】：是用来锁定安装时包的版本号；
5.接着在终端中输入：【npm install webpack】
如下图：
图6
同样将 dependencies 中的 "webpack" : "^5.72.0" 放入到 devDependencies 中去；
6.然后在终端中输入：【npm install vue-cli】 和【npm install webpack-dev-server】 ；
【npm install vue-cli】：安装的是 2.9.6 的版本；
如下图：
图7
【npm install webpack-dev-server】：安装的是 4.9.3 的版本；
如下图：
图8
安装完【npm install vue-cli】 和【npm install webpack-dev-server】之后，同样将下载的依赖也加入到 devDependencies 中去；
7.因为现在没有对 webpack 进行配置，而 webpack 的默认打包入口文件为 【src/index.js】，因此在项目根目录新建一个 src 的文件夹，再在 src 文件夹下面新建一个 index.js 文件；
如下图：
图9
这样就完成了【vue2+webpack】项目的基础依赖项的安装，后面会根据项目需求逐步完善相关依赖项和相关配置；
这篇文章先讲到这里，下篇文章继续。
关注公众号（月影WEB），了解更多的前后端知识；
欢迎大家关注互相交流学习；