vue3+ts+vite打包后静态资源404无法加载js和css
vue
vuejs/vue: 是一个用于构建用户界面的 JavaScript 框架,具有简洁的语法和丰富的组件库,可以用于开发单页面应用程序和多页面应用程序。
项目地址:https://gitcode.com/gh_mirrors/vu/vue
免费下载资源
·
vite 打包生成的文件如果直接放在服务器中是可以正常访问的,但是本地直接访问打包生成index.html文件就会提示以下问题。
访问的文件不存在,主要是因为路径配置问题。
提示跨域问题,不支持files协议,主要是因为esModule问题。
问题1:访问的文件不存在,主要是因为路径配置问题。
解决:在 vite.config.js文件中配置
主要:打包静态文件必须是根路径,否则放到服务器找不到静态资源(同理于webpack中的publicPath 的配置)
解决方法:
在vite.config.ts中设置:base: "./"具体代码如下
import { defineConfig } from 'vite'
import vue from '@vitejs/plugin-vue'
import { resolve } from 'path'
// https://vitejs.dev/config/
export default defineConfig({
base: "./", //等同于 assetsPublicPath :'./'
plugins: [vue()],
// 设置文件./src路径为 @
resolve: {
// 设置文件./src路径为 @
alias: [
{
find: '@',
replacement: resolve(__dirname, './src')
}
],
dedupe: [
'vue'
]
},
})
再次打包问题解决——
GitHub 加速计划 / vu / vue
207.54 K
33.66 K
下载
vuejs/vue: 是一个用于构建用户界面的 JavaScript 框架,具有简洁的语法和丰富的组件库,可以用于开发单页面应用程序和多页面应用程序。
最近提交(Master分支:2 个月前 )
73486cb5
* chore: fix link broken
Signed-off-by: snoppy <michaleli@foxmail.com>
* Update packages/template-compiler/README.md [skip ci]
---------
Signed-off-by: snoppy <michaleli@foxmail.com>
Co-authored-by: Eduardo San Martin Morote <posva@users.noreply.github.com> 4 个月前
e428d891
Updated Browser Compatibility reference. The previous currently returns HTTP 404. 5 个月前
更多推荐
已为社区贡献2条内容
所有评论(0)