Skip to content

Commit 18100d4

Browse files
cyfung1031Copilot
cyfung1031
and
Copilot
authored
🎨 Webpack 打包选项优化，去除不再需要的fixCoding (#1003)
* Webpack 打包选项优化 * webpack path语法优化 * 去除不再需要的fixCoding * webpack 优化 * Update webpack/webpack.dev.ts Co-authored-by: Copilot <175728472+Copilot@users.noreply.github.com> * `minimize: true,` --------- Co-authored-by: Copilot <175728472+Copilot@users.noreply.github.com>
1 parent d6331e3 commit 18100d4

10 files changed

Lines changed: 144 additions & 68 deletions

‎src/content.ts‎

Lines changed: 2 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,7 @@ import MessageInternal from "./app/message/internal";
55
import ContentRuntime from "./runtime/content/content";
66
// @ts-ignore
77
import injectJs from "../dist/inject.js";
8-
import { randomString, fixCoding } from "./pkg/utils/utils";
8+
import { randomString } from "./pkg/utils/utils";
99

1010
const internalMessage = new MessageInternal("content");
1111

@@ -17,13 +17,11 @@ const logger = new LoggerCore({
1717

1818
const scriptFlag = randomString(8);
1919

20-
const injectJs1 = fixCoding(injectJs);
21-
2220
// 注入运行框架
2321
const temp = document.createElementNS("http://www.w3.org/1999/xhtml", "script");
2422
temp.setAttribute("type", "text/javascript");
2523
temp.setAttribute("charset", "UTF-8");
26-
temp.textContent = `(function (ScriptFlag) {\n${injectJs1}\n})('${scriptFlag}')`;
24+
temp.textContent = `(function (ScriptFlag) {\n${injectJs}\n})('${scriptFlag}')`;
2725
temp.className = "injected-js";
2826
document.documentElement.appendChild(temp);
2927
temp.remove();

‎src/pkg/utils/utils.ts‎

Lines changed: 0 additions & 16 deletions
Original file line numberDiff line numberDiff line change
@@ -221,22 +221,6 @@ export function errorMsg(e: any): string {
221221
return "";
222222
}
223223

224-
export function fixCoding(text: string): string {
225-
const toXChar = (char: string) => {
226-
const c = char.charCodeAt(0).toString(16);
227-
if (c.length <= 2) return `\\x${c.padStart(2, "0")}`;
228-
return `\\u${c.padStart(4, "0")}`;
229-
};
230-
231-
return text
232-
.replace(/['"][\x00-\x1F]+['"]/g, (match) =>
233-
match.replace(/[\x00-\x1F]/g, toXChar)
234-
)
235-
.replace(/\b[a-z]{4,8}:\s*['"]\[(.)-(.)\]['"]/g, (match, start, end) =>
236-
match.replace(`${start}-${end}`, `${toXChar(start)}-${toXChar(end)}`)
237-
);
238-
}
239-
240224
export function blobToBase64(blob: Blob): Promise<string> {
241225
return new Promise((resolve) => {
242226
const reader = new FileReader();

‎webpack.config.ts‎

Lines changed: 5 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -176,7 +176,11 @@ const config: Configuration = {
176176
},
177177
optimization: {
178178
minimize: true,
179-
minimizer: [new TerserPlugin()],
179+
minimizer: [
180+
new TerserPlugin({
181+
extractComments: false, // 避免额外产生 .LICENSE.txt
182+
}),
183+
],
180184
splitChunks: {
181185
chunks: "all",
182186
minSize: 307200,

‎webpack/webpack.dev.ts‎

Lines changed: 12 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -1,15 +1,15 @@
11
/* eslint-disable import/no-extraneous-dependencies */
2+
import path from "path";
3+
import NodePolyfillPlugin from "node-polyfill-webpack-plugin";
24
import merge from "webpack-merge";
35
import CompressionPlugin from "compression-webpack-plugin";
46
import CopyPlugin from "copy-webpack-plugin";
7+
import TerserPlugin from "terser-webpack-plugin";
58
import common from "../webpack.config";
69

7-
const NodePolyfillPlugin = require("node-polyfill-webpack-plugin");
8-
const path = require("path");
9-
10-
const src = `${__dirname}/../src`;
11-
const dist = `${__dirname}/../dist`;
12-
const assets = `${__dirname}/../build/assets`;
10+
const src = path.resolve(__dirname, "../src");
11+
const dist = path.resolve(__dirname, "../dist");
12+
const assets = path.resolve(__dirname, "../build/assets");
1313

1414
common.entry = {
1515
// @ts-ignore
@@ -21,13 +21,16 @@ common.entry = {
2121
};
2222

2323
common.output = {
24-
path: `${dist}/ext/src`,
24+
path: path.join(dist, "ext/src"),
2525
filename: "[name].js",
2626
clean: false,
2727
};
2828

29-
// 取消splitChunks
30-
common.optimization = {};
29+
common.optimization = {
30+
minimize: false,
31+
splitChunks: false,
32+
runtimeChunk: false,
33+
};
3134

3235
export default merge(common, {
3336
watch: true,

‎webpack/webpack.i18n.ts‎

Lines changed: 17 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -1,16 +1,16 @@
11
/* eslint-disable import/no-extraneous-dependencies */
2+
import path from "path";
3+
import NodePolyfillPlugin from "node-polyfill-webpack-plugin";
24
import merge from "webpack-merge";
35
import CompressionPlugin from "compression-webpack-plugin";
46
import CopyPlugin from "copy-webpack-plugin";
57
import HtmlWebpackPlugin from "html-webpack-plugin";
8+
import TerserPlugin from "terser-webpack-plugin";
69
import common from "../webpack.config";
710

8-
const NodePolyfillPlugin = require("node-polyfill-webpack-plugin");
9-
const path = require("path");
10-
11-
const src = `${__dirname}/../src`;
12-
const dist = `${__dirname}/../dist`;
13-
const assets = `${__dirname}/../build/assets`;
11+
const src = path.resolve(__dirname, "../src");
12+
const dist = path.resolve(__dirname, "../dist");
13+
const assets = path.resolve(__dirname, "../build/assets");
1414

1515
common.entry = {
1616
// @ts-ignore
@@ -22,13 +22,21 @@ common.entry = {
2222
};
2323

2424
common.output = {
25-
path: `${dist}/ext/src`,
25+
path: path.join(dist, "ext/src"),
2626
filename: "[name].js",
2727
clean: false,
2828
};
2929

30-
// 取消splitChunks
31-
common.optimization = {};
30+
common.optimization = {
31+
minimize: true,
32+
splitChunks: false,
33+
runtimeChunk: false,
34+
minimizer: [
35+
new TerserPlugin({
36+
extractComments: false, // 避免额外产生 .LICENSE.txt
37+
}),
38+
],
39+
};
3240

3341
common.plugins = common.plugins!.filter((plugin) => {
3442
if (plugin instanceof HtmlWebpackPlugin && plugin.userOptions) {

‎webpack/webpack.inject.dev.ts‎

Lines changed: 20 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,12 +1,14 @@
11
/* eslint-disable import/no-extraneous-dependencies */
2+
import path from "path";
23
import merge from "webpack-merge";
34
import HtmlWebpackPlugin from "html-webpack-plugin";
45
import CopyPlugin from "copy-webpack-plugin";
56
import { CleanWebpackPlugin } from "clean-webpack-plugin";
7+
import TerserPlugin from "terser-webpack-plugin";
68
import common from "../webpack.config";
79

8-
const src = `${__dirname}/../src`;
9-
const dist = `${__dirname}/../dist`;
10+
const src = path.resolve(__dirname, "../src");
11+
const dist = path.resolve(__dirname, "../dist");
1012

1113
// 不要分割的文件
1214
common.entry = {
@@ -19,8 +21,22 @@ common.output = {
1921
clean: false,
2022
};
2123

22-
// 取消splitChunks
23-
common.optimization = {};
24+
common.optimization = {
25+
minimize: true,
26+
splitChunks: false,
27+
runtimeChunk: false,
28+
minimizer: [
29+
new TerserPlugin({
30+
extractComments: false, // 避免额外产生 .LICENSE.txt
31+
terserOptions: {
32+
format: {
33+
// 输出只用 ASCII，非 ASCII 变成 \uXXXX
34+
ascii_only: true,
35+
},
36+
},
37+
}),
38+
],
39+
};
2440

2541
// 移除插件
2642
common.plugins = common.plugins!.filter(

‎webpack/webpack.inject.ts‎

Lines changed: 20 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,12 +1,14 @@
11
/* eslint-disable import/no-extraneous-dependencies */
2+
import path from "path";
23
import merge from "webpack-merge";
34
import HtmlWebpackPlugin from "html-webpack-plugin";
45
import CopyPlugin from "copy-webpack-plugin";
56
import { CleanWebpackPlugin } from "clean-webpack-plugin";
7+
import TerserPlugin from "terser-webpack-plugin";
68
import common from "../webpack.config";
79

8-
const src = `${__dirname}/../src`;
9-
const dist = `${__dirname}/../dist`;
10+
const src = path.resolve(__dirname, "../src");
11+
const dist = path.resolve(__dirname, "../dist");
1012

1113
// 不要分割的文件
1214
common.entry = {
@@ -19,8 +21,22 @@ common.output = {
1921
clean: false,
2022
};
2123

22-
// 取消splitChunks
23-
common.optimization = {};
24+
common.optimization = {
25+
minimize: true,
26+
splitChunks: false,
27+
runtimeChunk: false,
28+
minimizer: [
29+
new TerserPlugin({
30+
extractComments: false, // 避免额外产生 .LICENSE.txt
31+
terserOptions: {
32+
format: {
33+
// 输出只用 ASCII，非 ASCII 变成 \uXXXX
34+
ascii_only: true,
35+
},
36+
},
37+
}),
38+
],
39+
};
2440

2541
// 移除插件
2642
common.plugins = common.plugins!.filter(

‎webpack/webpack.linter.dev.ts‎

Lines changed: 23 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -1,25 +1,41 @@
11
/* eslint-disable import/no-extraneous-dependencies */
2+
import path from "path";
3+
import NodePolyfillPlugin from "node-polyfill-webpack-plugin";
24
import merge from "webpack-merge";
5+
import TerserPlugin from "terser-webpack-plugin";
36
import common from "../webpack.config";
47

5-
const NodePolyfillPlugin = require("node-polyfill-webpack-plugin");
6-
7-
const src = `${__dirname}/../src`;
8-
const dist = `${__dirname}/../dist`;
8+
const src = path.resolve(__dirname, "../src");
9+
const dist = path.resolve(__dirname, "../dist");
910

1011
// eslint文件
1112
common.entry = {
1213
"linter.worker": `${src}/linter.worker.ts`,
1314
};
1415

1516
common.output = {
16-
path: `${dist}/ext/src`,
17+
globalObject: "self",
18+
path: path.join(dist, "ext/src"),
1719
filename: "[name].js",
1820
clean: false,
1921
};
2022

21-
// 取消splitChunks
22-
common.optimization = {};
23+
common.optimization = {
24+
minimize: true,
25+
splitChunks: false,
26+
runtimeChunk: false,
27+
minimizer: [
28+
new TerserPlugin({
29+
extractComments: false, // 避免额外产生 .LICENSE.txt
30+
terserOptions: {
31+
format: {
32+
// 输出只用 ASCII，非 ASCII 变成 \uXXXX
33+
ascii_only: true,
34+
},
35+
},
36+
}),
37+
],
38+
};
2339

2440
// 移除插件
2541
common.plugins = [];

‎webpack/webpack.linter.ts‎

Lines changed: 23 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -1,26 +1,41 @@
11
/* eslint-disable import/no-extraneous-dependencies */
2+
import path from "path";
3+
import NodePolyfillPlugin from "node-polyfill-webpack-plugin";
24
import merge from "webpack-merge";
5+
import TerserPlugin from "terser-webpack-plugin";
36
import common from "../webpack.config";
47

5-
const path = require("path");
6-
const NodePolyfillPlugin = require("node-polyfill-webpack-plugin");
7-
8-
const src = `${__dirname}/../src`;
9-
const dist = `${__dirname}/../dist`;
8+
const src = path.resolve(__dirname, "../src");
9+
const dist = path.resolve(__dirname, "../dist");
1010

1111
// eslint文件
1212
common.entry = {
1313
"linter.worker": `${src}/linter.worker.ts`,
1414
};
1515

1616
common.output = {
17-
path: `${dist}/ext/src`,
17+
globalObject: "self",
18+
path: path.join(dist, "ext/src"),
1819
filename: "[name].js",
1920
clean: false,
2021
};
2122

22-
// 取消splitChunks
23-
common.optimization = {};
23+
common.optimization = {
24+
minimize: true,
25+
splitChunks: false,
26+
runtimeChunk: false,
27+
minimizer: [
28+
new TerserPlugin({
29+
extractComments: false, // 避免额外产生 .LICENSE.txt
30+
terserOptions: {
31+
format: {
32+
// 输出只用 ASCII，非 ASCII 变成 \uXXXX
33+
ascii_only: true,
34+
},
35+
},
36+
}),
37+
],
38+
};
2439

2540
// 移除插件
2641
common.plugins = [];

‎webpack/webpack.no.split.ts‎

Lines changed: 22 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -1,29 +1,45 @@
11
/* eslint-disable import/no-extraneous-dependencies */
2+
import path from "path";
23
import merge from "webpack-merge";
34
import HtmlWebpackPlugin from "html-webpack-plugin";
45
import CopyPlugin from "copy-webpack-plugin";
56
import CompressionPlugin from "compression-webpack-plugin";
67
import { CleanWebpackPlugin } from "clean-webpack-plugin";
8+
import TerserPlugin from "terser-webpack-plugin";
79
import common from "../webpack.config";
810

9-
const src = `${__dirname}/../src`;
10-
const dist = `${__dirname}/../dist`;
11+
const src = path.resolve(__dirname, "../src");
12+
const dist = path.resolve(__dirname, "../dist");
1113

1214
// 不要分割的文件
1315
common.entry = {
14-
content: `${src}/content.ts`,
16+
content: path.join(src, "content.ts"),
1517
"editor.worker": "monaco-editor/esm/vs/editor/editor.worker.js",
1618
"ts.worker": "monaco-editor/esm/vs/language/typescript/ts.worker.js",
1719
};
1820

1921
common.output = {
20-
path: `${dist}/ext/src`,
22+
path: path.join(dist, "ext/src"),
2123
filename: "[name].js",
2224
clean: false,
2325
};
2426

25-
// 取消splitChunks
26-
common.optimization = {};
27+
common.optimization = {
28+
minimize: true,
29+
splitChunks: false,
30+
runtimeChunk: false,
31+
minimizer: [
32+
new TerserPlugin({
33+
extractComments: false, // 避免额外产生 .LICENSE.txt
34+
terserOptions: {
35+
format: {
36+
// 输出只用 ASCII，非 ASCII 变成 \uXXXX
37+
ascii_only: true,
38+
},
39+
},
40+
}),
41+
],
42+
};
2743

2844
// 移除插件
2945
common.plugins = common.plugins!.filter(

0 commit comments

Comments
 (0)