vue3写了一个上传附件的功能,本地能正常上传,但是部署到服务器上时,报upload.addEventListener is not a function
解决办法:
1:改node_modules
node_modules/mockjs/dist/mock.js 第8308行 和 node_modules/mockjs/src/xhr/xhr.js 第216行加入MockXMLHttpRequest.prototype.upload = xhr.upload
; 但是这种方法治标不治本,依赖被覆盖后,依然会报错
// 如果未找到匹配的数据模板,则采用原生 XHR 发送请求。
if (!item) {
// 创建原生 XHR 对象,调用原生 open(),监听所有原生事件
var xhr = createNativeXMLHttpRequest()
this.custom.xhr = xhr
MockXMLHttpRequest.prototype.upload = xhr.upload;
// 初始化所有事件,用于监听原生 XHR 对象的事件
for (var i = 0; i < XHR_EVENTS.length; i++) {
xhr.addEventListener(XHR_EVENTS[i], handle)
}
// 如果未找到匹配的数据模板,则采用原生 XHR 发送请求。
if (!item) {
// 创建原生 XHR 对象,调用原生 open(),监听所有原生事件
var xhr = createNativeXMLHttpRequest()
this.custom.xhr = xhr
MockXMLHttpRequest.prototype.upload = xhr.upload;
// 初始化所有事件,用于监听原生 XHR 对象的事件
for (var i = 0; i < XHR_EVENTS.length; i++) {
xhr.addEventListener(XHR_EVENTS[i], handle)
}
2,卸载mock 如果线上这模块没什么卵用,直接移除
3,更改配置项(推荐)
在 …\build\vite\plugin\mock.ts文件中将 prodEnabled: false,:
直接将prodEnabled写死
import { viteMockServe } from 'vite-plugin-mock';
export function configMockPlugin(isBuild: boolean) {
return viteMockServe({
ignore: /^\_/,
mockPath: 'mock',
localEnabled: !isBuild,
prodEnabled: false,
injectCode: `
import { setupProdMockServer } from '../mock/_createProductionServer';
setupProdMockServer();
`,
});
}