1. 生成生产版本
首先，确保你已经使用 vue-cli-service build 命令生成了生产版本的应用程序。这将在项目根目录下生成一个 dist 目录，包含了所有构建好的静态文件。
vue-cli-service build
2. 静态文件服务器
如果你的应用是一个纯静态应用（没有服务器端渲染），你可以使用任何静态文件服务器来托管 dist 目录。一种简便的方法是使用 serve：
npm install -g serve
serve -s dist
上述命令将在 dist 目录启动一个简单的 HTTP 服务器，你可以通过浏览器访问 http://localhost:5000 来查看你的应用。
3. 部署到 GitHub Pages
如果你的项目是开源的，你可以使用 GitHub Pages 来托管你的静态应用。在 package.json 文件中，你可以添加一个 "homepage" 字段，指定你的 GitHub Pages 地址：
{
"homepage": "https://username.github.io/repo-name"
}
然后，运行 npm run build 构建应用，并将生成的 dist 目录推送到 GitHub 仓库。在仓库的 Settings 页面中，找到 GitHub Pages 部分，选择 main 分支（或其他分支）作为源，然后保存即可。
4. 使用 Netlify 部署
[Netlify](https://www.netlify.com/) 是一个提供持续集成和静态文件托管的服务。你可以通过以下步骤将 Vue CLI 应用部署到 Netlify：
- 在项目根目录创建一个 netlify.toml 文件，并添加一些配置信息，例如：
[build]
command = "npm run build"
publish = "dist"
- 将项目推送到 GitHub（或其他支持的版本控制平台）。
- 在 Netlify 网站上登录并导入你的项目。选择构建命令、输出目录等配置，然后点击 "Deploy" 按钮。
Netlify 将自动构建和部署你的应用，并为你提供一个公开访问的 URL。
5. 其他托管服务
除了上述方法外，还有许多其他支持静态文件托管的服务，如 Vercel、Firebase Hosting、AWS S3 等。选择一个适合你需求的服务，并按照其文档进行配置和部署。
这些是一些常见的 Vue CLI 部署方法，具体选择取决于你的项目需求和团队的偏好。无论选择哪种方法，都确保在部署之前详细阅读相应的文档，并确保你的应用能够正常运行。
转载请注明出处：http://www.zyzy.cn/article/detail/4834/Vue