关于v3,ts打包后静态资源找不到文件的具体问题。

今天在打包的时候遇到了一些问题,项目在打包上线之后配置的ts文件找不到。 导致资源加载失败报错。

图为

在网上搜索了相关资料,显示将script标签的type值设置为module就可以解决该问题。

但是我的这个ts文件不能使用module的type。  查看vite静态资源官网。

在pulid文件下放置你需要的文件。然后把

pubilcDir改成true。 根目录直接按照 /文件名 引入即可。

也可用copy插件解决该问题。 这里就不说了。有博主写过了。 谢谢大家。有更好的方法可以分享。

问题的原因可能是在webpack配置中使用了url-loader后,静态图片的引用地址出现了问题。根据引用\[1\]中的解决方法,可以尝试在url-loader的配置中添加`esModule: false`选项,以解决图片src显示为`\[object Module\]`的问题。但是,这可能还不足以解决问题,因为引用\[2\]中提到,打包后的图片url和实际生成的图片url不对应,说明图片引用地址仍然存在问题。 为了解决这个问题,可以尝试在url-loader的配置中添加`outputPath`和`publicPath`选项。根据引用\[1\]中的解决方法,可以将静态图片放在与引用的vue文件同级目录的`static/img`目录下,然后配置`outputPath`为`static/img`,这样打包前和打包后的路径就能对应上了。 另外,根据引用\[3\]中的解决方法,还可以在vite.config.js文件中配置`base`选项为根路径,以确保打包后的静态文件能够正确访问。 综上所述,可以尝试在url-loader的配置中添加`esModule: false`选项,并配置`outputPath`为`static/img`,同时在vite.config.js文件中配置`base`选项为根路径,以解决静态资源打包后无法显示的问题。 #### 引用[.reference_title] - *1* *2* [【webpack】webpack打包后, 静态图片资源不显示的若干个问题](https://blog.csdn.net/qq_45481971/article/details/127848154)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v91^koosearch_v1,239^v3^insert_chatgpt"}} ] [.reference_item] - *3* [vite打包静态文件打开显示空白](https://blog.csdn.net/A_bet_of_three_years/article/details/128809633)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v91^koosearch_v1,239^v3^insert_chatgpt"}} ] [.reference_item] [ .reference_list ]
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值