以下步骤是详细地新建一个 Vue 项目:
1. 首先,安装 Node.js。
在命令行中输入 node -v
来检查 Node.js 是否已安装,
并使用 npm -v
来检查 npm 是否已安装。
如果还没有安装 Node.js,请前往 Node.js 官方网站(https://nodejs.org/)下载并安装。
2. 安装 Vue CLI。
Vue CLI 是一个基于 Node.js 的命令行工具,用于快速搭建 Vue 项目。
运行以下命令来检查 Vue CLI 的版本
:如果 Vue CLI 成功安装,命令行会显示 Vue CLI 的版本号。
vue --version
如果没有Vue CLI,则运行以下命令来全局安装最新版本的 Vue CLI
:
npm install -g @vue/cli
3. 创建新项目。
在命令行中,进入你想要创建项目的目录,然后运行以下命令来创建一个新的 Vue 项目:
vue create vue my-project
这里的 my-project
是自己定义的项目名称,可以根据需要修改。
运行上述命令后,Vue CLI 会提示你选择预设配置。
- 如果你是初学者,可以选择默认配置(default)。Vue CLI 会为你创建一个基本的 Vue 项目,包含常用的配置和插件。
- 如果你想手动选择特性,可以选择手动配置(Manually select features)。Vue CLI 会列出一系列可选的特性和插件,你可以根据需要进行选择。空格键是选中与取消,A键是全选。
4.等待项目创建完成。
Vue CLI 会自动下载并安装项目所需的依赖项,这可能需要一些时间。当项目创建完成后,你会看到一个类似下面的提示:
Project creation complete. To get started:
cd my-project // 进入到项目根目录
npm run serve // 启动项目
5. 进入项目目录。
在命令行中,进入刚刚创建的项目目录:
cd my-project
6. 启动开发服务器。
运行以下命令来启动开发服务器:
npm run serve
这将启动一个本地开发服务器,并在浏览器中打开你的 Vue 应用程序。你可以在开发服务器运行时进行开发,并实时查看更改结果。
这样,你就成功创建了一个新的 Vue 项目,并启动了开发服务器。你可以根据需要修改和开发你的 Vue 应用程序。