如何使用vue.config.js将vue js项目部署到子目录

使用vue.config.js将Vue.js项目部署到子目录的步骤如下：

1. 在Vue.js项目的根目录下创建一个名为vue.config.js的文件（如果已存在，请跳过此步骤）。
2. 打开vue.config.js文件，并添加以下内容：

module.exports = {
  publicPath: '/subdirectory/',
  outputDir: 'dist',
}

其中，publicPath指定了项目在服务器上的基础路径，即子目录的路径。例如，如果子目录为/subdirectory/，则将publicPath设置为'/subdirectory/'。

outputDir指定了打包后的文件输出目录，默认为dist。

1. 保存vue.config.js文件。
2. 在终端中运行以下命令，以将项目打包到指定的子目录：

npm run build

该命令将会在outputDir指定的目录下生成打包后的文件。

1. 将生成的打包文件（位于outputDir目录下）上传到服务器的子目录中。
2. 在服务器上配置子目录的访问，确保服务器能够正确识别子目录中的index.html文件。
3. 访问子目录的URL，即可查看部署成功的Vue.js项目。

请注意，以上步骤仅适用于将Vue.js项目部署到子目录。如果需要将项目部署到根目录或其他目录，请相应地修改publicPath的值。

推荐的腾讯云相关产品：腾讯云云服务器（CVM）、腾讯云对象存储（COS）。

腾讯云云服务器（CVM）是一种灵活可扩展的云计算服务，可提供安全可靠的计算能力，适用于各种场景的应用部署。

腾讯云对象存储（COS）是一种安全、高可靠、低成本的云端存储服务，适用于存储和处理大规模非结构化数据。

更多关于腾讯云云服务器和对象存储的详细信息，请访问以下链接：

• 腾讯云云服务器（CVM）：https://cloud.tencent.com/product/cvm
• 腾讯云对象存储（COS）：https://cloud.tencent.com/product/cos