as mentioned, the nuxt project built with npm run build does not display the page properly in all versions of the ie browser
the problem occurs in the vendor.js and manifest.js files packaged by webpack, as shown in the following figure:
related codes
nuxt.confing.js
build: {
/*
** Run ESLint on save
*/
//babel:{
//presets:["babel-polyfill"],
//},
extend (config, { isDev, isClient, isServer }) {
if (isDev && isClient) {
config.entry["polyfill"] = ["babel-polyfill"]
config.module.rules.push({
enforce: "pre",
test: /\.(js|vue)$/,
loader: "eslint-loader",
exclude: /(node_modules)/
})
}
//if (isServer) {
// config.externals = [
// nodeExternals({
// whitelist:[/es6-promise|\.(?!(?:js|json)$).{1,5}$/i, /^vue-echarts/]
// })
// ]
//}
}
} I directly reported an error when I added babel-polyfill,es2015, result build to the babel configuration of nuxt.config.js. After using stage-0, the build vendor.js file became smaller, but it still could not be displayed normally in ie environment.
package.json is as follows:
{
"name": "cpc",
"version": "1.0.0",
"description": "Nuxt.js project",
"author": "",
"private": true,
"scripts": {
"dev": "nuxt",
"build": "nuxt build && nuxt start",
"start": "PORT=8181 nuxt start",
"generate": "nuxt generate",
"lint": "eslint --ext .js,.vue --ignore-path .gitignore .",
"precommit": "npm run lint"
},
"dependencies": {
"@xkeshi/vue-qrcode": "^1.0.0",
"axios": "^0.18.0",
"babel-preset-es2015": "^6.24.1",
"echart": "^0.1.3",
"nuxt": "^1.0.0",
"vue-awesome-swiper": "^3.1.3",
"vue-echarts": "^3.0.9",
"vue-style-loader": "^4.1.0"
},
"devDependencies": {
"babel-eslint": "^8.2.1",
"babel-polyfill": "^6.26.0",
"babel-preset-es2015-ie": "^6.7.0",
"babel-preset-stage-0": "^6.24.1",
"eslint": "^4.15.0",
"eslint-friendly-formatter": "^3.0.0",
"eslint-loader": "^1.7.1",
"eslint-plugin-vue": "^4.0.0",
"webpack-node-externals": "^1.7.2"
},
"config": {
"nuxt": {
"host": "",
"port": ""
}
}
}