vite使用了多页面应用模式，打包时alias配置的路径别名报错
项目结构
打包配置
const modelName = process.env.MODEL_NAME || "all";
let inputConfig = {
['main']: resolve(__dirname, "src/index.html"),
['international']: resolve(__dirname, "src/international/index.html"),
['train']: resolve(__dirname, "src/train/index.html"),
};
if(modelName !== 'all') {
inputConfig = {
[modelName]: resolve(__dirname, `src/${modelName}/index.html`)
}
}
export default defineConfig({
plugins: [vue()],
resolve: {
alias: {
"@": resolve("src")
},
extensions: ['.js', '.ts', '.vue']
},
root: "./src/",
// 项目部署的基础路径
base: './',
// 环境配置
// mode: 'development',
// 静态资源服务文件夹
publicDir: 'public',
build: {
// 浏览器兼容性 ‘esnext’ | 'modules'
target: 'modules',
//输出路径
outDir: '../dist',
// 生成静态资源的存放路径
assetsDir: '../assets',
// 启动 / 禁用 CSS 代码拆分
cssCodeSplit: true,
// 混淆器，terser构建后文件体积更小
minify: 'terser',
//打包前先清空原有打包文件
emptyOutDir: true,
// 自定义底层的 Rollup 打包配置
rollupOptions: {
input: inputConfig,
output: {
chunkFileNames: (chunkInfo) => {
let idStr = chunkInfo.facadeModuleId ? chunkInfo.facadeModuleId.toString().split('src/')[1].split('/')[0].toString() : '';
return chunkInfo.facadeModuleId ? `${idStr}/js/[name].[hash].js` : `assets/js/[name].[hash].js`;
},
entryFileNames: (entryInfo) => {
let facadeModuleId = entryInfo.facadeModuleId;
let idStr = facadeModuleId.toString().split('src/')[1].split('/')[0].toString();
return `${idStr}/js/[name]-[hash].js`;
},
assetFileNames: (assetInfo) => {
let extType = null;
let moduleName = '';
if (assetInfo && assetInfo.name && assetInfo.name.includes('/')) {
moduleName = assetInfo.name.toString().split('/')[0].toString();
let info = assetInfo.name.split('.')
extType = info[info.length - 1];
if (assetInfo.name.indexOf('assets') != -1) {
let assets = assetInfo.name.toString().split('src/')[1].split('/')[0].toString();
moduleName = assets;
}
if (
/\.(mp4|webm|ogg|mp3|wav|flac|aac)(\?.*)?$/i.test(assetInfo.name)
) {
extType = 'media'
} else if (/\.(png|jpe?g|gif|svg)(\?.*)?$/.test(assetInfo.name)) {
extType = 'img'
} else if (/\.(woff2?|eot|ttf|otf)(\?.*)?$/i.test(assetInfo.name)) {
extType = 'fonts'
} else if (/\.(css|sass|less)(\?.*)?$/i.test(assetInfo.name)) {
extType = 'css'
}
}
return `${moduleName || 'assets'}/${extType || '[ext]'}/[name]-[hash][extname]`;
}
},
// 清除console
terserOptions: {
compress: {
drop_console: true,
drop_debugger: true,
},
},
}
}
})
运行的报错
Cannot find module '@/api/index' or its corresponding type declarations.
我的解答思路和尝试过的方法
dev模式下就正常，build就报这个错，怀疑是ts检测路径报错或者是多页面路径问题
我想要达到的结果
请大家帮忙看一下，如何解决这个路径问题
