GitHub Demo 地址
在线预览
vue3项目打包后部署到github pages 后，预览网站提示下划线开头的一个文件
_plugin-vue_export-helper访问不到，网络请求显示404
处理GitHub Pages 部署 _plugin-vue_export-helper.js 404
https://github.com/rollup/rollup/blob/master/src/utils/sanitizeFileName.ts
解决办法
需要修改配置 vite.config.js，重写打包的方案文章来源：https://www.toymoban.com/news/detail-731540.html
// 打包配置
const INVALID_CHAR_REGEX = /[\u0000-\u001F"#$&*+,:;<=>?[\]^`{|}\u007F]/g
const DRIVE_LETTER_REGEX = /^[a-z]:/i
export function setupBuild() {
return {
outDir: 'dist',
sourcemap: false,
// 消除打包大小超过500kb警告
chunkSizeWarningLimit: 2000,
rollupOptions: {
input: {
index: 'index.html'
},
// 静态资源分类打包
output: {
chunkFileNames: 'static/js/[name]-[hash].js',
entryFileNames: 'static/js/[name]-[hash].js',
assetFileNames: 'static/[ext]/[name]-[hash].[ext]',
// TODO: 处理GitHub Pages 部署 _plugin-vue_export-helper.js 404
// https://github.com/rollup/rollup/blob/master/src/utils/sanitizeFileName.ts
sanitizeFileName(name: any) {
const match = DRIVE_LETTER_REGEX.exec(name)
const driveLetter = match ? match[0] : ''
// A `:` is only allowed as part of a windows drive letter (ex: C:\foo)
// Otherwise, avoid them because they can refer to NTFS alternate data streams.
return driveLetter + name.slice(driveLetter.length).replace(INVALID_CHAR_REGEX, '')
},
manualChunks(id: any) {
if (id.includes('node_modules')) {
return id.toString().match(/\/node_modules\/(?!.pnpm)(?<moduleName>[^\/]*)\//)?.groups!.moduleName ?? 'vender'
}
}
// manualChunks(id) {
// if (id.includes('node_modules')) {
// return id.toString().split('node_modules/')[1].split('/')[0].toString()
// }
// }
}
}
}
}
vite.config.ts文件引入文章来源地址https://www.toymoban.com/news/detail-731540.html
import { setupBuild } from './build/index'
export default defineConfig({
build: setupBuild(),
});
到了这里，关于vue3 - Vue 项目处理GitHub Pages 部署后 _plugin-vue_export-helper.js 404的文章就介绍完了。如果您还想了解更多内容，请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章，希望大家以后多多支持TOY模板网！
