vue如何新建一个项目(详细版本)

以下步骤是详细地新建一个 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 应用程序。

猜你喜欢

转载自blog.csdn.net/weixin_48596030/article/details/131829042