- 前往 Node.js 官网下载并安装 Node.js，安装完成后，npm 会随之安装。确认 Node.js 和 npm 是否成功安装，可以在命令行中运行以下命令检查版本： 运行结果：（如下，node和npm安装成功。）e
在命令行中运行以下命令来安装 Vue CLI：
如下图，执行成功
进入你想要创建项目的目录，然后运行以下命令创建一个新的 Vue 项目：
注：我创建项目的时候遇到默认配置，如果不想使用默认配置的话可以运行以下命令创建新的额vue项目
在命令执行过程中，你会被询问一些问题，例如你想要使用的特性和插件，按照提示进行选择即可。
创建vue2项目就选择这个，选完之后按回车键。进度条跑完 成功就会出现如下图。
这将会在本地启动一个开发服务器，你可以在浏览器中访问 来预览你的应用。（其实这样一个简单的项目就配置好了，如果需要更完整的 继续往下）
如果你在创建 Vue 项目时选择了默认的配置（使用 Vue 3），则 Vue Router 已经包含在项目中了。如果没有，则需要手动安装 Vue Router。在项目目录中执行以下命令：
注意注意：这儿路由版本的问题 ，由于我们的项目是vue2的 ，所以我们在配置路由的时候也有安装对应版本的路由，否则的话就会报错。如下图
这儿就是路由版本问题 可以看一下 我的命令行写的是如下这个
解决办法就是：使用 Vue Router 2.x 版本：
在项目的 目录下创建一个新的文件夹，命名为 ，在这个文件夹下创建一个名为 的文件，用来配置路由。例如：如下图
在 文件中导入 Vue 和 Vue Router，并创建一个新的路由实例。然后定义路由映射关系，即路径和组件的对应关系。(提前创建好两个组件HomePage和AboutPage)
在你的 Vue 组件中使用路由。你可以在模板中使用 组件来创建导航链接，
在应用的入口文件中（通常是 ），将路由实例挂载到应用中。例如：
注意：
在创建路由的过程中，一定要注意版本问题，由于我们现在创建的是vue2项目，如果直接安装vue router版本 3.x的话 会出现冲突问题 ，所以我们要安装 Vue Router 2.x 版本。但是，但是 在引入路由的方法的时候 2.x中版本是不支持“ ”方法，如果你希望在 Vue Router v2 中使用哈希模式的路由，你需要使用 模式配置路由。在 Vue Router v2 中，可以直接使用 配置项来实现，而不需要调用 方法。
同时， 是 Vue 3 中新引入的方法，在 Vue 2 中是不存在的。
运行成功之后 页面会出现
可以点击，地址可以更换，这就说明成功了！
这样一个简易的vue2项目就搭建完成了。
版权声明：
本文来源网络，所有图片文章版权属于原作者，如有侵权，联系删除。
本文网址：https://www.mushiming.com/mjsbk/12768.html