Vue3 创建项目教程

vue create 命令

-p, --preset <presetName>： 忽略提示符并使用已保存的或远程的预设选项
-d, --default： 忽略提示符并使用默认预设选项
-i, --inlinePreset <json>： 忽略提示符并使用内联的 JSON 字符串预设选项
-m, --packageManager <command>： 在安装依赖时使用指定的 npm 客户端
-r, --registry <url>： 在安装依赖时使用指定的 npm registry
-g, --git [message]： 强制 / 跳过 git 初始化，并可选的指定初始化提交信息
-n, --no-git： 跳过 git 初始化
-f, --force： 覆写目标目录可能存在的配置
-c, --clone： 使用 git clone 获取远程预设选项
-x, --proxy： 使用指定的代理创建项目
-b, --bare： 创建项目时省略默认组件中的新手指导信息
-h, --help： 输出使用帮助信息

步骤 1：安装 Node.js

首先，确保你的计算机上已安装最新版本的 Node.js。Node.js 是一个基于 Chrome V8 引擎的 JavaScript 运行环境，它允许你在服务器端运行 JavaScript 代码。

你可以在https://nodejs.org下载 Node.js 安装程序，并根据操作系统的要求进行安装。

步骤 2：安装 Vue CLI

Vue CLI 是一个官方提供的用于快速搭建 Vue 项目的命令行工具。在命令行界面中执行以下命令来安装 Vue CLI：

    
      npm install -g @vue/cli
    
  

步骤 3：创建 Vue3 项目

在命令行界面中，进入你想要创建项目的目录，并执行以下命令来创建一个新的 Vue3 项目：

    
      vue create my-vue-project
    
  

这将启动 Vue CLI 的项目创建向导，你可以根据提示进行选择。

例如，你可以选择默认配置，其中包含了常用的插件和工具，也可以选择手动配置，根据自己的需求进行设置。你还可以使用预设模板，这些模板可以帮助你快速搭建特定类型的项目，如移动端应用或者使用 TypeScript 的项目。

步骤 4：运行项目

在创建项目后，进入项目目录：

    
      cd my-vue-project
    
  

然后执行以下命令来启动开发服务器：

    
      npm run serve
    
  

这将在本地启动一个开发服务器，并提供实时的热重载功能。你可以通过访问http://localhost:8080来预览你的项目。

步骤 5：开始开发

现在你已经成功创建了一个 Vue3 项目，并运行在本地开发服务器上。你可以编辑项目目录中的 src 文件夹下的文件来编写你的应用程序。

结论

通过按照以上步骤，你已经学会了如何创建一个 Vue3 项目，并在本地开发服务器上进行预览。现在你可以开始使用 Vue3 的强大功能来构建交互性强、可重用性高的现代 Web 应用程序了。