webpack.config.js
3.37 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
//引入path 是用的nodejs的一个path模块，path模块就是寻找当前目录的一个模块
const path = require("path");
const HtmlWebpackPlugin = require("html-webpack-plugin");
const { CleanWebpackPlugin } = require("clean-webpack-plugin");
const JavaScriptObfuscator = require("webpack-obfuscator");
module.exports = {
//模式：开发环境
mode: "development", //production 不写的话默认为生产模式
//入口文件 程序从这里开始执行，webpack开始打包
// vue3版本用audios.js,vue2版本用audio.js
entry: path.join(__dirname, "src", "/js/audio.js"), //__dirname指的是当前目录,是目录形成绝对路径
output: {
//输入的文件名
filename: "version21.js",
// filename: '[name].[hash:7].js',
publicPath: "/",
//输入的路径 webpack会自动打包生成
path: path.join(__dirname, "dist"),
},
resolve: {
extensions: [".js", ".css"],
},
plugins: [
new HtmlWebpackPlugin({
//文件中找到的路径
// vue3版本用index.html,vue2版本用v2.html
template: path.join(__dirname, "src", "html/v2.html"),
//打包输出的路径
filename: "version21.html",
}),
new CleanWebpackPlugin(),
new JavaScriptObfuscator(
{
compact: true, //压缩代码
controlFlowFlattening: true, //是否启用控制流扁平化(降低1.5倍的运行速度)
controlFlowFlatteningThreshold: 1, //应用概率;在较大的代码库中，建议降低此值，因为大量的控制流转换可能会增加代码的大小并降低代码的速度。
// deadCodeInjection: true, //随机的死代码块(增加了混淆代码的大小)
// debugProtection: true, //此选项几乎不可能使用开发者工具的控制台选项卡
// debugProtectionInterval: true, //如果选中，则会在“控制台”选项卡上使用间隔强制调试模式，从而更难使用“开发人员工具”的其他功能。
// disableConsoleOutput: true, //通过用空函数替换它们来禁用console.log，console.info，console.error和console.warn。这使得调试器的使用更加困难。
// renameGlobals: true, //是否启用全局变量和函数名称的混淆
// rotateStringArray: true, //通过固定和随机（在代码混淆时生成）的位置移动数组。这使得将删除的字符串的顺序与其原始位置相匹配变得更加困难。如果原始源代码不小，建议使用此选项，因为辅助函数可以引起注意。
// selfDefending: true, //混淆后的代码,不能使用代码美化,同时需要配置 cpmpat:true;
// cpmpat:true,
// stringArray: true, //删除字符串文字并将它们放在一个特殊的数组中
// transformObjectKeys: true,
// unicodeEscapeSequence: false,
},
[]
),
],
devServer: {
//端口
port: 3000,
compress: true,
overlay: true,
contentBase: "/html/index.html",
},
module: {
rules: [
//引入css插件 npm install --save-dev css-loader
{
test: /\.css$/,
// use: ['style-loader', 'css-loader'],
use: [
{
loader: "style-loader",
},
{
loader: "css-loader",
},
],
},
{
test: /\.js$/,
exclude: /node_modules/,
loader: 'babel-loader'
}
],
},
};