fix(拆包优化): 修复部分异步加载的包出现 LoadingError

--bug=1026921 --user=白奇 【测试跟踪】项目设置-文件管理页面-跳转至测试跟踪页面失败 https://www.tapd.cn/55049933/s/1381589
This commit is contained in:
baiqi 2023-06-14 11:17:45 +08:00 committed by 刘瑞斌
parent e5dda8d9a7
commit 9e603821f2
16 changed files with 528 additions and 442 deletions

View File

@ -7,19 +7,21 @@
<link rel="icon" href="<%= BASE_URL %>favicon.ico" />
<title><%= htmlWebpackPlugin.options.title %></title>
<% if (process.env.NODE_ENV==='development' ) { %>
<link rel="stylesheet" href="http://localhost:3000/js/dev/element-ui/element-ui.css" />
<script src="http://localhost:3000/js/dev/vue.js"></script>
<script src="http://localhost:3000/js/dev/element-ui/element-ui.js"></script>
<script src="http://localhost:3000/js/dev/vue-router.js"></script>
<script src="http://localhost:3000/js/prd/vue-shepherd.min.js"></script>
<script src="http://localhost:3000/js/prd/mavon-editor.js"></script>
<link rel="stylesheet" href="http://localhost:3000/js/dev/element-ui/element-ui.css" />
<script src="http://localhost:3000/js/dev/qiankun.umd.js"></script>
<script src="http://localhost:3000/js/dev/vue.js"></script>
<script src="http://localhost:3000/js/dev/element-ui/element-ui.js"></script>
<script src="http://localhost:3000/js/dev/vue-router.js"></script>
<script src="http://localhost:3000/js/prd/vue-shepherd.min.js"></script>
<script src="http://localhost:3000/js/prd/mavon-editor.js"></script>
<% } else { %>
<link rel="stylesheet" href="<%= BASE_URL %>js/prd/element-ui/element-ui.min.css" />
<script src="<%= BASE_URL %>js/prd/vue.min.js"></script>
<script src="<%= BASE_URL %>js/prd/element-ui/element-ui.min.js"></script>
<script src="<%= BASE_URL %>js/prd/vue-router.min.js"></script>
<script src="<%= BASE_URL %>js/prd/vue-shepherd.min.js"></script>
<script src="<%= BASE_URL %>js/prd/mavon-editor.js"></script>
<link rel="stylesheet" href="<%= BASE_URL %>js/prd/element-ui/element-ui.min.css" />
<script src="<%= BASE_URL %>js/prd/qiankun.umd.min.js"></script>
<script src="<%= BASE_URL %>js/prd/vue.min.js"></script>
<script src="<%= BASE_URL %>js/prd/element-ui/element-ui.min.js"></script>
<script src="<%= BASE_URL %>js/prd/vue-router.min.js"></script>
<script src="<%= BASE_URL %>js/prd/vue-shepherd.min.js"></script>
<script src="<%= BASE_URL %>js/prd/mavon-editor.js"></script>
<% } %>
</head>

View File

@ -52,9 +52,9 @@ module.exports = {
resolve: {
alias: {
'@': resolve('src'),
'mockjs': resolve('node_modules/mockjs'),
mockjs: resolve('node_modules/mockjs'),
'vue-i18n': resolve('node_modules/vue-i18n'),
'jsondiffpatch': resolve('node_modules/jsondiffpatch'),
jsondiffpatch: resolve('node_modules/jsondiffpatch'),
},
},
output: {
@ -67,12 +67,13 @@ module.exports = {
chunkFilename: `js/${name}-[name].[contenthash:8].js`,
},
externals: {
qiankun: 'qiankun',
vue: 'Vue',
'element-ui': 'ELEMENT',
'vue-router': 'VueRouter',
// 'echarts': 'echarts',
// 'echarts/core': 'echarts', // TODO:外链使用的话需要改造导入及 vue-echarts 的源码
// brace: 'brace', // TODO:暂时未发现能外链的方法本体包未提供cdn 外链形式的包
'element-ui': 'ELEMENT',
'mavon-editor': 'MavonEditor',
'vue-shepherd': 'VueShepherd',
},
@ -96,19 +97,43 @@ module.exports = {
html2canvas: {
test: /[\\/]html2canvas[\\/]/,
name: 'html2canvas',
priority: 2,
priority: 3,
chunks: 'all',
},
fortawesome: {
test: /[\\/]@fortawesome[\\/]/,
name: 'fortawesome',
priority: 2,
priority: 3,
chunks: 'all',
},
'el-tree-transfer': {
test: /[\\/]el-tree-transfer[\\/]/,
name: 'el-tree-transfer',
priority: 2,
priority: 3,
chunks: 'all',
},
jspdf: {
test: /[\\/]jspdf[\\/]/,
name: 'jspdf',
priority: 3,
chunks: 'all',
},
jsondiffpatch: {
test: /[\\/]jsondiffpatch[\\/]/,
name: 'jsondiffpatch',
priority: 3,
chunks: 'all',
},
jsencrypt: {
test: /[\\/]jsencrypt[\\/]/,
name: 'jsencrypt',
priority: 3,
chunks: 'all',
},
mockjs: {
test: /[\\/]mockjs[\\/]/,
name: 'mockjs',
priority: 3,
chunks: 'all',
},
pinia: {
@ -129,30 +154,6 @@ module.exports = {
priority: 3,
chunks: 'all',
},
jspdf: {
test: /[\\/]jspdf[\\/]/,
name: 'jspdf',
priority: 2,
chunks: 'all',
},
jsondiffpatch: {
test: /[\\/]jsondiffpatch[\\/]/,
name: 'jsondiffpatch',
priority: 2,
chunks: 'all',
},
jsencrypt: {
test: /[\\/]jsencrypt[\\/]/,
name: 'jsencrypt',
priority: 2,
chunks: 'all',
},
mockjs: {
test: /[\\/]mockjs[\\/]/,
name: 'mockjs',
priority: 2,
chunks: 'all',
},
},
},
},

View File

@ -1,5 +1,6 @@
const path = require('path');
const BundleAnalyzerPlugin = require('webpack-bundle-analyzer').BundleAnalyzerPlugin;
const path = require("path");
const BundleAnalyzerPlugin =
require("webpack-bundle-analyzer").BundleAnalyzerPlugin;
function resolve(dir) {
return path.join(__dirname, dir);
@ -10,117 +11,114 @@ module.exports = {
devServer: {
port: 3000,
client: {
webSocketTransport: 'sockjs',
webSocketTransport: "sockjs",
},
webSocketServer: 'sockjs',
allowedHosts: 'all',
webSocketServer: "sockjs",
allowedHosts: "all",
proxy: {
['^((?!/login)(?!/document))']: {
target: 'http://localhost:8000',
ws: false
["^((?!/login)(?!/document))"]: {
target: "http://localhost:8000",
ws: false,
},
'/websocket': {
target: 'http://localhost:8000',
ws: true
"/websocket": {
target: "http://localhost:8000",
ws: true,
},
},
},
configureWebpack: {
devtool: 'cheap-module-source-map',
devtool: "cheap-module-source-map",
resolve: {
alias: {
'@': resolve('src')
}
"@": resolve("src"),
},
},
externals: {
vue: 'Vue',
'vue-router': 'VueRouter',
qiankun: 'qiankun',
qiankun: "qiankun",
vue: "Vue",
"vue-router": "VueRouter",
// 'echarts': 'echarts',
// 'echarts/core': 'echarts', // TODO:外链使用的话需要改造导入及 vue-echarts 的源码
// brace: 'brace', // TODO:暂时未发现能外链的方法本体包未提供cdn 外链形式的包
'element-ui': 'ELEMENT',
'vue-shepherd': 'VueShepherd',
"element-ui": "ELEMENT",
"vue-shepherd": "VueShepherd",
},
optimization: {
splitChunks: {
cacheGroups: {
'chunk-vendors': {
"chunk-vendors": {
test: /[\\/]node_modules[\\/]/,
name: 'chunk-vendors',
name: "chunk-vendors",
priority: 1,
minChunks: 3,
chunks: 'all',
chunks: "all",
},
'chunk-common': {
"chunk-common": {
test: /[\\/]src[\\/]/,
name: 'chunk-common',
name: "chunk-common",
priority: 1,
minChunks: 5,
chunks: 'all',
chunks: "all",
},
html2canvas: {
test: /[\\/]html2canvas[\\/]/,
name: 'html2canvas',
priority: 2,
chunks: 'all',
name: "html2canvas",
priority: 3,
chunks: "all",
},
fortawesome: {
test: /[\\/]@fortawesome[\\/]/,
name: 'fortawesome',
priority: 2,
chunks: 'all',
},
pinia: {
test: /[\\/]pinia[\\/]/,
name: 'pinia',
name: "fortawesome",
priority: 3,
chunks: 'all',
chunks: "all",
},
jspdf: {
test: /[\\/]jspdf[\\/]/,
name: 'jspdf',
priority: 2,
chunks: 'all',
name: "jspdf",
priority: 3,
chunks: "all",
},
jsencrypt: {
test: /[\\/]jsencrypt[\\/]/,
name: 'jsencrypt',
priority: 2,
chunks: 'all',
name: "jsencrypt",
priority: 3,
chunks: "all",
},
pinia: {
test: /[\\/]pinia[\\/]/,
name: "pinia",
priority: 3,
chunks: "all",
},
},
},
},
},
chainWebpack: config => {
config.devtool('source-map')
config.resolve.alias.set('@', resolve('./src'))
config.output.library("MsFrontend")
chainWebpack: (config) => {
config.devtool("source-map");
config.resolve.alias.set("@", resolve("./src"));
config.output.library("MsFrontend");
config.module.rule("svg").exclude.add(resolve("src/assets/module")).end();
config.module
.rule('svg')
.exclude.add(resolve('src/assets/module'))
.end()
config.module
.rule('icons')
.rule("icons")
.test(/\.svg$/)
.include.add(resolve('src/assets/module'))
.include.add(resolve("src/assets/module"))
.end()
.use('svg-sprite-loader')
.loader('svg-sprite-loader')
.use("svg-sprite-loader")
.loader("svg-sprite-loader")
.options({
symbolId: 'icon-[name]'
})
symbolId: "icon-[name]",
});
if (process.env.NODE_ENV === 'analyze') {
config.plugin('webpack-report').use(BundleAnalyzerPlugin, [
{
analyzerMode: 'static',
reportFilename: './webpack-report.html',
openAnalyzer: false,
},
]);
}
}
if (process.env.NODE_ENV === "analyze") {
config.plugin("webpack-report").use(BundleAnalyzerPlugin, [
{
analyzerMode: "static",
reportFilename: "./webpack-report.html",
openAnalyzer: false,
},
]);
}
},
};

View File

@ -1,33 +1,44 @@
<!DOCTYPE html>
<html lang="">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width,initial-scale=1.0">
<link rel="icon" href="<%= BASE_URL %>favicon.ico">
<title><%= htmlWebpackPlugin.options.title %></title>
<% if (process.env.NODE_ENV==='development' ) { %>
<link rel="stylesheet" href="http://localhost:3000/js/dev/element-ui/element-ui.css" />
<head>
<meta charset="utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width,initial-scale=1.0" />
<link rel="icon" href="<%= BASE_URL %>favicon.ico" />
<title><%= htmlWebpackPlugin.options.title %></title>
<% if (process.env.NODE_ENV==='development' ) { %>
<link
rel="stylesheet"
href="http://localhost:3000/js/dev/element-ui/element-ui.css"
/>
<script src="http://localhost:3000/js/dev/qiankun.umd.js"></script>
<script src="http://localhost:3000/js/dev/vue.js"></script>
<script src="http://localhost:3000/js/dev/element-ui/element-ui.js"></script>
<script src="http://localhost:3000/js/dev/vue-router.js"></script>
<script src="http://localhost:3000/js/prd/vue-shepherd.min.js"></script>
<script src="http://localhost:3000/js/prd/mavon-editor.js"></script>
<% } else { %>
<link rel="stylesheet" href="<%= BASE_URL %>js/prd/element-ui/element-ui.min.css" />
<% } else { %>
<link
rel="stylesheet"
href="<%= BASE_URL %>js/prd/element-ui/element-ui.min.css"
/>
<script src="<%= BASE_URL %>js/prd/qiankun.umd.min.js"></script>
<script src="<%= BASE_URL %>js/prd/vue.min.js"></script>
<script src="<%= BASE_URL %>js/prd/element-ui/element-ui.min.js"></script>
<script src="<%= BASE_URL %>js/prd/vue-router.min.js"></script>
<script src="<%= BASE_URL %>js/prd/vue-shepherd.min.js"></script>
<script src="<%= BASE_URL %>js/prd/mavon-editor.js"></script>
<% } %>
</head>
<body>
<noscript>
<strong>We're sorry but <%= htmlWebpackPlugin.options.title %> doesn't work properly without JavaScript enabled. Please enable it to
continue.</strong>
</noscript>
<div id="app"></div>
<!-- built files will be auto injected -->
</body>
<% } %>
</head>
<body>
<noscript>
<strong
>We're sorry but <%= htmlWebpackPlugin.options.title %> doesn't work
properly without JavaScript enabled. Please enable it to
continue.</strong
>
</noscript>
<div id="app"></div>
<!-- built files will be auto injected -->
</body>
</html>

View File

@ -50,8 +50,8 @@ module.exports = {
resolve: {
alias: {
"@": resolve("src"),
'html2canvas': resolve('node_modules/html2canvas'),
'vue-i18n': resolve('node_modules/vue-i18n'),
html2canvas: resolve("node_modules/html2canvas"),
"vue-i18n": resolve("node_modules/vue-i18n"),
},
fallback: { stream: require.resolve("stream-browserify") },
},
@ -65,12 +65,13 @@ module.exports = {
chunkFilename: `js/${name}-[name].[contenthash:8].js`,
},
externals: {
qiankun: "qiankun",
vue: "Vue",
"element-ui": "ELEMENT",
"vue-router": "VueRouter",
// 'echarts': 'echarts',
// 'echarts/core': 'echarts', // TODO:外链使用的话需要改造导入及 vue-echarts 的源码
// brace: 'brace', // TODO:暂时未发现能外链的方法本体包未提供cdn 外链形式的包
"element-ui": "ELEMENT",
"mavon-editor": "MavonEditor",
"vue-shepherd": "VueShepherd",
},
@ -94,19 +95,43 @@ module.exports = {
html2canvas: {
test: /[\\/]html2canvas[\\/]/,
name: "html2canvas",
priority: 2,
priority: 3,
chunks: "all",
},
fortawesome: {
test: /[\\/]@fortawesome[\\/]/,
name: "fortawesome",
priority: 2,
priority: 3,
chunks: "all",
},
"el-tree-transfer": {
test: /[\\/]el-tree-transfer[\\/]/,
name: "el-tree-transfer",
priority: 2,
priority: 3,
chunks: "all",
},
jspdf: {
test: /[\\/]jspdf[\\/]/,
name: "jspdf",
priority: 3,
chunks: "all",
},
jsondiffpatch: {
test: /[\\/]jsondiffpatch[\\/]/,
name: "jsondiffpatch",
priority: 3,
chunks: "all",
},
jsencrypt: {
test: /[\\/]jsencrypt[\\/]/,
name: "jsencrypt",
priority: 3,
chunks: "all",
},
mockjs: {
test: /[\\/]mockjs[\\/]/,
name: "mockjs",
priority: 3,
chunks: "all",
},
pinia: {
@ -127,30 +152,6 @@ module.exports = {
priority: 3,
chunks: "all",
},
jspdf: {
test: /[\\/]jspdf[\\/]/,
name: "jspdf",
priority: 2,
chunks: "all",
},
jsondiffpatch: {
test: /[\\/]jsondiffpatch[\\/]/,
name: "jsondiffpatch",
priority: 2,
chunks: "all",
},
jsencrypt: {
test: /[\\/]jsencrypt[\\/]/,
name: "jsencrypt",
priority: 2,
chunks: "all",
},
mockjs: {
test: /[\\/]mockjs[\\/]/,
name: "mockjs",
priority: 2,
chunks: "all",
},
},
},
},

View File

@ -1,33 +1,44 @@
<!DOCTYPE html>
<html lang="">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width,initial-scale=1.0">
<link rel="icon" href="<%= BASE_URL %>favicon.ico">
<title><%= htmlWebpackPlugin.options.title %></title>
<% if (process.env.NODE_ENV==='development' ) { %>
<link rel="stylesheet" href="http://localhost:3000/js/dev/element-ui/element-ui.css" />
<head>
<meta charset="utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width,initial-scale=1.0" />
<link rel="icon" href="<%= BASE_URL %>favicon.ico" />
<title><%= htmlWebpackPlugin.options.title %></title>
<% if (process.env.NODE_ENV==='development' ) { %>
<link
rel="stylesheet"
href="http://localhost:3000/js/dev/element-ui/element-ui.css"
/>
<script src="http://localhost:3000/js/dev/qiankun.umd.js"></script>
<script src="http://localhost:3000/js/dev/vue.js"></script>
<script src="http://localhost:3000/js/dev/element-ui/element-ui.js"></script>
<script src="http://localhost:3000/js/dev/vue-router.js"></script>
<script src="http://localhost:3000/js/prd/vue-shepherd.min.js"></script>
<script src="http://localhost:3000/js/prd/mavon-editor.js"></script>
<% } else { %>
<link rel="stylesheet" href="<%= BASE_URL %>js/prd/element-ui/element-ui.min.css" />
<% } else { %>
<link
rel="stylesheet"
href="<%= BASE_URL %>js/prd/element-ui/element-ui.min.css"
/>
<script src="<%= BASE_URL %>js/prd/qiankun.umd.min.js"></script>
<script src="<%= BASE_URL %>js/prd/vue.min.js"></script>
<script src="<%= BASE_URL %>js/prd/element-ui/element-ui.min.js"></script>
<script src="<%= BASE_URL %>js/prd/vue-router.min.js"></script>
<script src="<%= BASE_URL %>js/prd/vue-shepherd.min.js"></script>
<script src="<%= BASE_URL %>js/prd/mavon-editor.js"></script>
<% } %>
</head>
<body>
<noscript>
<strong>We're sorry but <%= htmlWebpackPlugin.options.title %> doesn't work properly without JavaScript enabled. Please enable it to
continue.</strong>
</noscript>
<div id="app"></div>
<!-- built files will be auto injected -->
</body>
<% } %>
</head>
<body>
<noscript>
<strong
>We're sorry but <%= htmlWebpackPlugin.options.title %> doesn't work
properly without JavaScript enabled. Please enable it to
continue.</strong
>
</noscript>
<div id="app"></div>
<!-- built files will be auto injected -->
</body>
</html>

View File

@ -36,8 +36,8 @@ module.exports = {
resolve: {
alias: {
"@": resolve("src"),
'vue-i18n': resolve('node_modules/vue-i18n'),
'jsondiffpatch': resolve('node_modules/jsondiffpatch'),
"vue-i18n": resolve("node_modules/vue-i18n"),
jsondiffpatch: resolve("node_modules/jsondiffpatch"),
},
},
output: {
@ -50,12 +50,13 @@ module.exports = {
chunkFilename: `js/${name}-[name].[contenthash:8].js`,
},
externals: {
qiankun: "qiankun",
vue: "Vue",
"element-ui": "ELEMENT",
"vue-router": "VueRouter",
// 'echarts': 'echarts',
// 'echarts/core': 'echarts', // TODO:外链使用的话需要改造导入及 vue-echarts 的源码
// brace: 'brace', // TODO:暂时未发现能外链的方法本体包未提供cdn 外链形式的包
"element-ui": "ELEMENT",
"mavon-editor": "MavonEditor",
"vue-shepherd": "VueShepherd",
},
@ -79,19 +80,43 @@ module.exports = {
html2canvas: {
test: /[\\/]html2canvas[\\/]/,
name: "html2canvas",
priority: 2,
priority: 3,
chunks: "all",
},
fortawesome: {
test: /[\\/]@fortawesome[\\/]/,
name: "fortawesome",
priority: 2,
priority: 3,
chunks: "all",
},
"el-tree-transfer": {
test: /[\\/]el-tree-transfer[\\/]/,
name: "el-tree-transfer",
priority: 2,
priority: 3,
chunks: "all",
},
jspdf: {
test: /[\\/]jspdf[\\/]/,
name: "jspdf",
priority: 3,
chunks: "all",
},
jsondiffpatch: {
test: /[\\/]jsondiffpatch[\\/]/,
name: "jsondiffpatch",
priority: 3,
chunks: "all",
},
jsencrypt: {
test: /[\\/]jsencrypt[\\/]/,
name: "jsencrypt",
priority: 3,
chunks: "all",
},
mockjs: {
test: /[\\/]mockjs[\\/]/,
name: "mockjs",
priority: 3,
chunks: "all",
},
pinia: {
@ -106,30 +131,6 @@ module.exports = {
priority: 3,
chunks: "all",
},
jspdf: {
test: /[\\/]jspdf[\\/]/,
name: "jspdf",
priority: 2,
chunks: "all",
},
jsondiffpatch: {
test: /[\\/]jsondiffpatch[\\/]/,
name: "jsondiffpatch",
priority: 2,
chunks: "all",
},
jsencrypt: {
test: /[\\/]jsencrypt[\\/]/,
name: "jsencrypt",
priority: 2,
chunks: "all",
},
mockjs: {
test: /[\\/]mockjs[\\/]/,
name: "mockjs",
priority: 2,
chunks: "all",
},
},
},
},

View File

@ -1,33 +1,44 @@
<!DOCTYPE html>
<html lang="">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width,initial-scale=1.0">
<link rel="icon" href="<%= BASE_URL %>favicon.ico">
<title><%= htmlWebpackPlugin.options.title %></title>
<% if (process.env.NODE_ENV==='development' ) { %>
<link rel="stylesheet" href="http://localhost:3000/js/dev/element-ui/element-ui.css" />
<head>
<meta charset="utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width,initial-scale=1.0" />
<link rel="icon" href="<%= BASE_URL %>favicon.ico" />
<title><%= htmlWebpackPlugin.options.title %></title>
<% if (process.env.NODE_ENV==='development' ) { %>
<link
rel="stylesheet"
href="http://localhost:3000/js/dev/element-ui/element-ui.css"
/>
<script src="http://localhost:3000/js/dev/qiankun.umd.js"></script>
<script src="http://localhost:3000/js/dev/vue.js"></script>
<script src="http://localhost:3000/js/dev/element-ui/element-ui.js"></script>
<script src="http://localhost:3000/js/dev/vue-router.js"></script>
<script src="http://localhost:3000/js/prd/vue-shepherd.min.js"></script>
<script src="http://localhost:3000/js/prd/mavon-editor.js"></script>
<% } else { %>
<link rel="stylesheet" href="<%= BASE_URL %>js/prd/element-ui/element-ui.min.css" />
<% } else { %>
<link
rel="stylesheet"
href="<%= BASE_URL %>js/prd/element-ui/element-ui.min.css"
/>
<script src="<%= BASE_URL %>js/prd/qiankun.umd.min.js"></script>
<script src="<%= BASE_URL %>js/prd/vue.min.js"></script>
<script src="<%= BASE_URL %>js/prd/element-ui/element-ui.min.js"></script>
<script src="<%= BASE_URL %>js/prd/vue-router.min.js"></script>
<script src="<%= BASE_URL %>js/prd/vue-shepherd.min.js"></script>
<script src="<%= BASE_URL %>js/prd/mavon-editor.js"></script>
<% } %>
</head>
<body>
<noscript>
<strong>We're sorry but <%= htmlWebpackPlugin.options.title %> doesn't work properly without JavaScript enabled. Please enable it to
continue.</strong>
</noscript>
<div id="app"></div>
<!-- built files will be auto injected -->
</body>
<% } %>
</head>
<body>
<noscript>
<strong
>We're sorry but <%= htmlWebpackPlugin.options.title %> doesn't work
properly without JavaScript enabled. Please enable it to
continue.</strong
>
</noscript>
<div id="app"></div>
<!-- built files will be auto injected -->
</body>
</html>

View File

@ -48,8 +48,8 @@ module.exports = {
resolve: {
alias: {
"@": resolve("src"),
'vue-i18n': resolve('node_modules/vue-i18n'),
'html2canvas': resolve('node_modules/html2canvas'),
"vue-i18n": resolve("node_modules/vue-i18n"),
html2canvas: resolve("node_modules/html2canvas"),
},
},
output: {
@ -62,12 +62,13 @@ module.exports = {
chunkFilename: `js/${name}-[name].[contenthash:8].js`,
},
externals: {
qiankun: "qiankun",
vue: "Vue",
"element-ui": "ELEMENT",
"vue-router": "VueRouter",
// 'echarts': 'echarts',
// 'echarts/core': 'echarts', // TODO:外链使用的话需要改造导入及 vue-echarts 的源码
// brace: 'brace', // TODO:暂时未发现能外链的方法本体包未提供cdn 外链形式的包
"element-ui": "ELEMENT",
"mavon-editor": "MavonEditor",
"vue-shepherd": "VueShepherd",
},
@ -91,19 +92,31 @@ module.exports = {
html2canvas: {
test: /[\\/]html2canvas[\\/]/,
name: "html2canvas",
priority: 2,
priority: 3,
chunks: "all",
},
fortawesome: {
test: /[\\/]@fortawesome[\\/]/,
name: "fortawesome",
priority: 2,
priority: 3,
chunks: "all",
},
"el-tree-transfer": {
test: /[\\/]el-tree-transfer[\\/]/,
name: "el-tree-transfer",
priority: 2,
priority: 3,
chunks: "all",
},
jspdf: {
test: /[\\/]jspdf[\\/]/,
name: "jspdf",
priority: 3,
chunks: "all",
},
jsencrypt: {
test: /[\\/]jsencrypt[\\/]/,
name: "jsencrypt",
priority: 3,
chunks: "all",
},
pinia: {
@ -124,18 +137,6 @@ module.exports = {
priority: 3,
chunks: "all",
},
jspdf: {
test: /[\\/]jspdf[\\/]/,
name: "jspdf",
priority: 2,
chunks: "all",
},
jsencrypt: {
test: /[\\/]jsencrypt[\\/]/,
name: "jsencrypt",
priority: 2,
chunks: "all",
},
},
},
},

View File

@ -1,33 +1,44 @@
<!DOCTYPE html>
<html lang="">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width,initial-scale=1.0">
<link rel="icon" href="<%= BASE_URL %>favicon.ico">
<title><%= htmlWebpackPlugin.options.title %></title>
<% if (process.env.NODE_ENV==='development' ) { %>
<link rel="stylesheet" href="http://localhost:3000/js/dev/element-ui/element-ui.css" />
<head>
<meta charset="utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width,initial-scale=1.0" />
<link rel="icon" href="<%= BASE_URL %>favicon.ico" />
<title><%= htmlWebpackPlugin.options.title %></title>
<% if (process.env.NODE_ENV==='development' ) { %>
<link
rel="stylesheet"
href="http://localhost:3000/js/dev/element-ui/element-ui.css"
/>
<script src="http://localhost:3000/js/dev/qiankun.umd.js"></script>
<script src="http://localhost:3000/js/dev/vue.js"></script>
<script src="http://localhost:3000/js/dev/element-ui/element-ui.js"></script>
<script src="http://localhost:3000/js/dev/vue-router.js"></script>
<script src="http://localhost:3000/js/prd/vue-shepherd.min.js"></script>
<script src="http://localhost:3000/js/prd/mavon-editor.js"></script>
<% } else { %>
<link rel="stylesheet" href="<%= BASE_URL %>js/prd/element-ui/element-ui.min.css" />
<% } else { %>
<link
rel="stylesheet"
href="<%= BASE_URL %>js/prd/element-ui/element-ui.min.css"
/>
<script src="<%= BASE_URL %>js/prd/qiankun.umd.min.js"></script>
<script src="<%= BASE_URL %>js/prd/vue.min.js"></script>
<script src="<%= BASE_URL %>js/prd/element-ui/element-ui.min.js"></script>
<script src="<%= BASE_URL %>js/prd/vue-router.min.js"></script>
<script src="<%= BASE_URL %>js/prd/vue-shepherd.min.js"></script>
<script src="<%= BASE_URL %>js/prd/mavon-editor.js"></script>
<% } %>
</head>
<body>
<noscript>
<strong>We're sorry but <%= htmlWebpackPlugin.options.title %> doesn't work properly without JavaScript enabled. Please enable it to
continue.</strong>
</noscript>
<div id="app"></div>
<!-- built files will be auto injected -->
</body>
<% } %>
</head>
<body>
<noscript>
<strong
>We're sorry but <%= htmlWebpackPlugin.options.title %> doesn't work
properly without JavaScript enabled. Please enable it to
continue.</strong
>
</noscript>
<div id="app"></div>
<!-- built files will be auto injected -->
</body>
</html>

View File

@ -36,8 +36,8 @@ module.exports = {
resolve: {
alias: {
"@": resolve("src"),
'vue-i18n': resolve('node_modules/vue-i18n'),
'jsondiffpatch': resolve('node_modules/jsondiffpatch'),
"vue-i18n": resolve("node_modules/vue-i18n"),
jsondiffpatch: resolve("node_modules/jsondiffpatch"),
},
},
output: {
@ -50,12 +50,13 @@ module.exports = {
chunkFilename: `js/${name}-[name].[contenthash:8].js`,
},
externals: {
qiankun: "qiankun",
vue: "Vue",
"element-ui": "ELEMENT",
"vue-router": "VueRouter",
// 'echarts': 'echarts',
// 'echarts/core': 'echarts', // TODO:外链使用的话需要改造导入及 vue-echarts 的源码
// brace: 'brace', // TODO:暂时未发现能外链的方法本体包未提供cdn 外链形式的包
"element-ui": "ELEMENT",
"mavon-editor": "MavonEditor",
"vue-shepherd": "VueShepherd",
},
@ -79,19 +80,43 @@ module.exports = {
html2canvas: {
test: /[\\/]html2canvas[\\/]/,
name: "html2canvas",
priority: 2,
priority: 3,
chunks: "all",
},
fortawesome: {
test: /[\\/]@fortawesome[\\/]/,
name: "fortawesome",
priority: 2,
priority: 3,
chunks: "all",
},
"el-tree-transfer": {
test: /[\\/]el-tree-transfer[\\/]/,
name: "el-tree-transfer",
priority: 2,
priority: 3,
chunks: "all",
},
jspdf: {
test: /[\\/]jspdf[\\/]/,
name: "jspdf",
priority: 3,
chunks: "all",
},
jsondiffpatch: {
test: /[\\/]jsondiffpatch[\\/]/,
name: "jsondiffpatch",
priority: 3,
chunks: "all",
},
jsencrypt: {
test: /[\\/]jsencrypt[\\/]/,
name: "jsencrypt",
priority: 3,
chunks: "all",
},
mockjs: {
test: /[\\/]mockjs[\\/]/,
name: "mockjs",
priority: 3,
chunks: "all",
},
pinia: {
@ -106,30 +131,6 @@ module.exports = {
priority: 3,
chunks: "all",
},
jspdf: {
test: /[\\/]jspdf[\\/]/,
name: "jspdf",
priority: 2,
chunks: "all",
},
jsondiffpatch: {
test: /[\\/]jsondiffpatch[\\/]/,
name: "jsondiffpatch",
priority: 2,
chunks: "all",
},
jsencrypt: {
test: /[\\/]jsencrypt[\\/]/,
name: "jsencrypt",
priority: 2,
chunks: "all",
},
mockjs: {
test: /[\\/]mockjs[\\/]/,
name: "mockjs",
priority: 2,
chunks: "all",
},
},
},
},

View File

@ -42,6 +42,7 @@
"lodash.isnumber": "^3.0.3",
"lodash.isobject": "^3.0.2",
"lodash.isstring": "^4.0.1",
"lodash-es": "^4.17.21",
"mavon-editor": "2.10.4",
"md5": "^2.3.0",
"metersphere-frontend": "file:../../framework/sdk-parent/frontend",
@ -118,4 +119,4 @@
"last 2 versions",
"not dead"
]
}
}

View File

@ -1,33 +1,44 @@
<!DOCTYPE html>
<html lang="">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width,initial-scale=1.0">
<link rel="icon" href="<%= BASE_URL %>favicon.ico">
<title><%= htmlWebpackPlugin.options.title %></title>
<% if (process.env.NODE_ENV==='development' ) { %>
<link rel="stylesheet" href="http://localhost:3000/js/dev/element-ui/element-ui.css" />
<head>
<meta charset="utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width,initial-scale=1.0" />
<link rel="icon" href="<%= BASE_URL %>favicon.ico" />
<title><%= htmlWebpackPlugin.options.title %></title>
<% if (process.env.NODE_ENV==='development' ) { %>
<link
rel="stylesheet"
href="http://localhost:3000/js/dev/element-ui/element-ui.css"
/>
<script src="http://localhost:3000/js/dev/qiankun.umd.js"></script>
<script src="http://localhost:3000/js/dev/vue.js"></script>
<script src="http://localhost:3000/js/dev/element-ui/element-ui.js"></script>
<script src="http://localhost:3000/js/dev/vue-router.js"></script>
<script src="http://localhost:3000/js/prd/vue-shepherd.min.js"></script>
<script src="http://localhost:3000/js/prd/mavon-editor.js"></script>
<% } else { %>
<link rel="stylesheet" href="<%= BASE_URL %>js/prd/element-ui/element-ui.min.css" />
<% } else { %>
<link
rel="stylesheet"
href="<%= BASE_URL %>js/prd/element-ui/element-ui.min.css"
/>
<script src="<%= BASE_URL %>js/prd/qiankun.umd.min.js"></script>
<script src="<%= BASE_URL %>js/prd/vue.min.js"></script>
<script src="<%= BASE_URL %>js/prd/element-ui/element-ui.min.js"></script>
<script src="<%= BASE_URL %>js/prd/vue-router.min.js"></script>
<script src="<%= BASE_URL %>js/prd/vue-shepherd.min.js"></script>
<script src="<%= BASE_URL %>js/prd/mavon-editor.js"></script>
<% } %>
</head>
<body>
<noscript>
<strong>We're sorry but <%= htmlWebpackPlugin.options.title %> doesn't work properly without JavaScript enabled. Please enable it to
continue.</strong>
</noscript>
<div id="app"></div>
<!-- built files will be auto injected -->
</body>
<% } %>
</head>
<body>
<noscript>
<strong
>We're sorry but <%= htmlWebpackPlugin.options.title %> doesn't work
properly without JavaScript enabled. Please enable it to
continue.</strong
>
</noscript>
<div id="app"></div>
<!-- built files will be auto injected -->
</body>
</html>

View File

@ -1,10 +1,11 @@
const path = require('path');
const {name} = require('./package');
const path = require("path");
const { name } = require("./package");
const HtmlWebpackInlineSourcePlugin = require('html-webpack-inline-source-plugin')
const HtmlWebpackPlugin = require('html-webpack-plugin');
const BundleAnalyzerPlugin = require('webpack-bundle-analyzer').BundleAnalyzerPlugin;
const InlineSourceWebpackPlugin = require('inline-source-webpack-plugin');
const HtmlWebpackInlineSourcePlugin = require("html-webpack-inline-source-plugin");
const HtmlWebpackPlugin = require("html-webpack-plugin");
const BundleAnalyzerPlugin =
require("webpack-bundle-analyzer").BundleAnalyzerPlugin;
const InlineSourceWebpackPlugin = require("inline-source-webpack-plugin");
function resolve(dir) {
return path.join(__dirname, dir);
@ -15,68 +16,71 @@ module.exports = {
devServer: {
port: 4005,
client: {
webSocketTransport: 'sockjs',
webSocketTransport: "sockjs",
},
allowedHosts: 'all',
webSocketServer: 'sockjs',
allowedHosts: "all",
webSocketServer: "sockjs",
proxy: {
['^((?!/login)(?!/document))']: {
target: 'http://localhost:8005',
ws: false
["^((?!/login)(?!/document))"]: {
target: "http://localhost:8005",
ws: false,
},
'/websocket': {
target: 'http://localhost:8005',
ws: true
"/websocket": {
target: "http://localhost:8005",
ws: true,
},
},
// 跨域
headers: {
'Access-Control-Allow-Origin': '*',
"Access-Control-Allow-Origin": "*",
},
},
pages: {
business: {
entry: "src/main.js",
template: "public/index.html",
filename: "index.html"
filename: "index.html",
},
sharePlanReport: {
entry: "src/business/template/report/plan/share/share-plan-report.js",
template: "src/business/template/report/plan/share/share-plan-report.html",
template:
"src/business/template/report/plan/share/share-plan-report.html",
filename: "share-plan-report.html",
},
planReport: { //这个配置要放最后不然会导致测试计划导出报告没有将css和js引入html原因没具体研究
planReport: {
//这个配置要放最后不然会导致测试计划导出报告没有将css和js引入html原因没具体研究
entry: "src/business/template/report/plan/plan-report.js",
template: "src/business/template/report/plan/plan-report.html",
filename: "plan-report.html",
inlineSource: '.*'
}
inlineSource: ".*",
},
},
configureWebpack: {
devtool: 'cheap-module-source-map',
devtool: "cheap-module-source-map",
resolve: {
alias: {
'@': resolve('src'),
'vue-i18n': resolve('node_modules/vue-i18n'),
"@": resolve("src"),
"vue-i18n": resolve("node_modules/vue-i18n"),
},
fallback: {"stream": require.resolve("stream-browserify")}
fallback: { stream: require.resolve("stream-browserify") },
},
output: {
// 把子应用打包成 umd 库格式(必须)
library: `${name}-[name]`,
libraryTarget: 'umd',
libraryTarget: "umd",
chunkLoadingGlobal: `webpackJsonp_${name}`,
// 打包后js的名称
filename: `js/${name}-[name].[contenthash:8].js`,
chunkFilename: `js/${name}-[name].[contenthash:8].js`,
},
externals: {
qiankun: "qiankun",
vue: "Vue",
"element-ui": "ELEMENT",
"vue-router": "VueRouter",
// 'echarts': 'echarts',
// 'echarts/core': 'echarts', // TODO:外链使用的话需要改造导入及 vue-echarts 的源码
// brace: 'brace', // TODO:暂时未发现能外链的方法本体包未提供cdn 外链形式的包
"element-ui": "ELEMENT",
"mavon-editor": "MavonEditor",
"vue-shepherd": "VueShepherd",
},
@ -115,24 +119,6 @@ module.exports = {
priority: 2,
chunks: "all",
},
pinia: {
test: /[\\/]pinia[\\/]/,
name: "pinia",
priority: 3,
chunks: "all",
},
brace: {
test: /[\\/]brace[\\/]/,
name: "brace",
priority: 3,
chunks: "all",
},
echarts: {
test: /[\\/](echarts|zrender)[\\/]/,
name: "echarts",
priority: 3,
chunks: "all",
},
jspdf: {
test: /[\\/]jspdf[\\/]/,
name: "jspdf",
@ -181,6 +167,24 @@ module.exports = {
priority: 2,
chunks: "all",
},
pinia: {
test: /[\\/]pinia[\\/]/,
name: "pinia",
priority: 3,
chunks: "all",
},
brace: {
test: /[\\/]brace[\\/]/,
name: "brace",
priority: 3,
chunks: "all",
},
echarts: {
test: /[\\/](echarts|zrender)[\\/]/,
name: "echarts",
priority: 3,
chunks: "all",
},
},
},
},
@ -193,46 +197,55 @@ module.exports = {
extract: {
ignoreOrder: true,
filename: `css/${name}-[name].[contenthash:8].css`,
chunkFilename: `css/${name}-[name].[contenthash:8].css`
chunkFilename: `css/${name}-[name].[contenthash:8].css`,
},
},
chainWebpack: config => {
chainWebpack: (config) => {
config.module
.rule('svg')
.exclude.add(resolve('../../framework/sdk-parent/frontend/src/assets/module'))
.end()
.rule("svg")
.exclude.add(
resolve("../../framework/sdk-parent/frontend/src/assets/module")
)
.end();
config.module
.rule('icons')
.rule("icons")
.test(/\.svg$/)
.include.add(resolve('../../framework/sdk-parent/frontend/src/assets/module'))
.include.add(
resolve("../../framework/sdk-parent/frontend/src/assets/module")
)
.end()
.use('svg-sprite-loader')
.loader('svg-sprite-loader')
.use("svg-sprite-loader")
.loader("svg-sprite-loader")
.options({
symbolId: 'icon-[name]'
})
symbolId: "icon-[name]",
});
// 报告模板打包成一个html
config.plugin('inline-source-html')
.after('html-planReport')
.use(new InlineSourceWebpackPlugin({
compress: true,
rootpath: '../../framework/sdk-parent/frontend/public/js',
noAssetMatch: 'warn'
}), [HtmlWebpackPlugin]);
config
.plugin("inline-source-html")
.after("html-planReport")
.use(
new InlineSourceWebpackPlugin({
compress: true,
rootpath: "../../framework/sdk-parent/frontend/public/js",
noAssetMatch: "warn",
}),
[HtmlWebpackPlugin]
);
config.plugin('inline-source-html-planReport')
.after('html-planReport')
config
.plugin("inline-source-html-planReport")
.after("html-planReport")
.use(HtmlWebpackInlineSourcePlugin, [HtmlWebpackPlugin]);
if (process.env.NODE_ENV === 'analyze') {
config.plugin('webpack-report').use(BundleAnalyzerPlugin, [
if (process.env.NODE_ENV === "analyze") {
config.plugin("webpack-report").use(BundleAnalyzerPlugin, [
{
analyzerMode: 'static',
reportFilename: './webpack-report.html',
analyzerMode: "static",
reportFilename: "./webpack-report.html",
openAnalyzer: false,
},
]);
}
}
},
};

View File

@ -1,33 +1,44 @@
<!DOCTYPE html>
<html lang="">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width,initial-scale=1.0">
<link rel="icon" href="<%= BASE_URL %>favicon.ico">
<title><%= htmlWebpackPlugin.options.title %></title>
<% if (process.env.NODE_ENV==='development' ) { %>
<link rel="stylesheet" href="http://localhost:3000/js/dev/element-ui/element-ui.css" />
<head>
<meta charset="utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width,initial-scale=1.0" />
<link rel="icon" href="<%= BASE_URL %>favicon.ico" />
<title><%= htmlWebpackPlugin.options.title %></title>
<% if (process.env.NODE_ENV==='development' ) { %>
<link
rel="stylesheet"
href="http://localhost:3000/js/dev/element-ui/element-ui.css"
/>
<script src="http://localhost:3000/js/dev/qiankun.umd.js"></script>
<script src="http://localhost:3000/js/dev/vue.js"></script>
<script src="http://localhost:3000/js/dev/element-ui/element-ui.js"></script>
<script src="http://localhost:3000/js/dev/vue-router.js"></script>
<script src="http://localhost:3000/js/prd/vue-shepherd.min.js"></script>
<script src="http://localhost:3000/js/prd/mavon-editor.js"></script>
<% } else { %>
<link rel="stylesheet" href="<%= BASE_URL %>js/prd/element-ui/element-ui.min.css" />
<% } else { %>
<link
rel="stylesheet"
href="<%= BASE_URL %>js/prd/element-ui/element-ui.min.css"
/>
<script src="<%= BASE_URL %>js/prd/qiankun.umd.min.js"></script>
<script src="<%= BASE_URL %>js/prd/vue.min.js"></script>
<script src="<%= BASE_URL %>js/prd/element-ui/element-ui.min.js"></script>
<script src="<%= BASE_URL %>js/prd/vue-router.min.js"></script>
<script src="<%= BASE_URL %>js/prd/vue-shepherd.min.js"></script>
<script src="<%= BASE_URL %>js/prd/mavon-editor.js"></script>
<% } %>
</head>
<body>
<noscript>
<strong>We're sorry but <%= htmlWebpackPlugin.options.title %> doesn't work properly without JavaScript enabled. Please enable it to
continue.</strong>
</noscript>
<div id="app"></div>
<!-- built files will be auto injected -->
</body>
<% } %>
</head>
<body>
<noscript>
<strong
>We're sorry but <%= htmlWebpackPlugin.options.title %> doesn't work
properly without JavaScript enabled. Please enable it to
continue.</strong
>
</noscript>
<div id="app"></div>
<!-- built files will be auto injected -->
</body>
</html>

View File

@ -36,7 +36,7 @@ module.exports = {
resolve: {
alias: {
"@": resolve("src"),
'vue-i18n': resolve('node_modules/vue-i18n'),
"vue-i18n": resolve("node_modules/vue-i18n"),
},
},
output: {
@ -49,12 +49,13 @@ module.exports = {
chunkFilename: `js/${name}-[name].[contenthash:8].js`,
},
externals: {
qiankun: "qiankun",
vue: "Vue",
"element-ui": "ELEMENT",
"vue-router": "VueRouter",
// 'echarts': 'echarts',
// 'echarts/core': 'echarts', // TODO:外链使用的话需要改造导入及 vue-echarts 的源码
// brace: 'brace', // TODO:暂时未发现能外链的方法本体包未提供cdn 外链形式的包
"element-ui": "ELEMENT",
"mavon-editor": "MavonEditor",
"vue-shepherd": "VueShepherd",
},
@ -78,19 +79,49 @@ module.exports = {
html2canvas: {
test: /[\\/]html2canvas[\\/]/,
name: "html2canvas",
priority: 2,
priority: 3,
chunks: "all",
},
fortawesome: {
test: /[\\/]@fortawesome[\\/]/,
name: "fortawesome",
priority: 2,
priority: 3,
chunks: "all",
},
"el-tree-transfer": {
test: /[\\/]el-tree-transfer[\\/]/,
name: "el-tree-transfer",
priority: 2,
priority: 3,
chunks: "all",
},
jspdf: {
test: /[\\/]jspdf[\\/]/,
name: "jspdf",
priority: 3,
chunks: "all",
},
sortablejs: {
test: /[\\/]sortablejs[\\/]/,
name: "sortablejs",
priority: 3,
chunks: "all",
},
jsencrypt: {
test: /[\\/]jsencrypt[\\/]/,
name: "jsencrypt",
priority: 3,
chunks: "all",
},
mockjs: {
test: /[\\/]mockjs[\\/]/,
name: "mockjs",
priority: 3,
chunks: "all",
},
lodash: {
test: /[\\/]lodash[\\/]/,
name: "lodash",
priority: 3,
chunks: "all",
},
pinia: {
@ -105,36 +136,6 @@ module.exports = {
priority: 3,
chunks: "all",
},
jspdf: {
test: /[\\/]jspdf[\\/]/,
name: "jspdf",
priority: 2,
chunks: "all",
},
sortablejs: {
test: /[\\/]sortablejs[\\/]/,
name: "sortablejs",
priority: 2,
chunks: "all",
},
jsencrypt: {
test: /[\\/]jsencrypt[\\/]/,
name: "jsencrypt",
priority: 2,
chunks: "all",
},
mockjs: {
test: /[\\/]mockjs[\\/]/,
name: "mockjs",
priority: 2,
chunks: "all",
},
lodash: {
test: /[\\/]lodash[\\/]/,
name: "lodash",
priority: 2,
chunks: "all",
},
},
},
},