极客观点
项目管理
HarmonyOS
问题描述
项目需要兼容IE浏览器，因此放弃了vue3，使用了vue2.7, @vue/cli-service5.0, element-ui2.15.14。使用babel和core-js/stable后，项目可以在ie浏览器中运行了。但随着业务开发，引入了element-ui中的Loading组件后，在IE浏览器中就报错了，像是css loader的错误。请大佬们帮忙看看是什么原因，谢谢！
问题出现的环境背景及自己尝试过哪些方法
"dependencies":
"axios": "^1.5.0",
"core-js": "^3.8.3",
"element-ui": "^2.15.14",
"vue": "2.7",
"vue-router": "^3.5.1""devDependencies":
"@babel/core": "^7.12.16",
"@babel/eslint-parser": "^7.12.16",
"@vue/cli-plugin-babel": "~5.0.0",
"@vue/cli-plugin-router": "~5.0.0",
"@vue/cli-service": "~5.0.0",
"babel-plugin-component": "^1.1.1",
"compressing": "^1.10.0",
"dayjs": "^1.11.9",
"sass": "^1.32.7",
"sass-loader": "^12.0.0",
"unplugin-auto-import": "^0.16.6",
"unplugin-vue-components": "^0.25.2",
"webpack-bundle-analyzer": "^4.9.1"
试过把main.js
相关代码
粘贴代码文本（请勿用截图）
main.js
import 'core-js/stable';
import Vue from 'vue';
import App from './App.vue';
import './style/main.scss'
import { router } from './router';
import { Loading } from 'element-ui'; // Loading不支持ie ？
Vue.config.productionTip = false;
Vue.use(Loading.directive);
new Vue({
router,
render: (h) => h(App),
}).$mount('#app');babel.config.js
module.exports = {
presets: [
'@vue/cli-plugin-babel/preset',
],
plugins: [
[
"component",
{
"libraryName": "element-ui",
"styleLibraryName": "theme-chalk"
}
]
]
};.browserlistrc
> 1%
last 2 versions
IE 11vue.config.js里加了transpileDependencies 也没用 T.T
const { defineConfig } = require('@vue/cli-service')
const AutoImport = require('unplugin-auto-import/webpack')
const Components = require('unplugin-vue-components/webpack')
// const BundleAnalyzerPlugin = require('webpack-bundle-analyzer').BundleAnalyzerPlugin
const { ElementUiResolver } = require('unplugin-vue-components/resolvers')
module.exports = defineConfig({
transpileDependencies: ['axios', 'element-ui'], // 转换node_modules
publicPath: process.env.VUE_APP_PUBLIC_PATH,
outputDir: 'dist',
......你期待的结果是什么？实际看到的错误信息又是什么？
在Chrome浏览器中正常，在IE浏览器（IE11）中报错。
SCRIPT445: 对象不支持此操作
base.css (12,1)
# 点进去是这一行
var ___CSS_LOADER_URL_IMPORT_0___ = new URL(/* asset import */ __webpack_require__(/*! fonts/element-icons.woff */ "./node_modules/.pnpm/element-ui@2.15.14_vue@2.7.14/node_modules/element-ui/lib/theme-chalk/fonts/element-icons.woff"), __webpack_require__.b);