diff --git a/.eslintignore b/.eslintignore new file mode 100644 index 0000000..3e22129 --- /dev/null +++ b/.eslintignore @@ -0,0 +1 @@ +/dist \ No newline at end of file diff --git a/.eslintrc.js b/.eslintrc.js new file mode 100644 index 0000000..a085185 --- /dev/null +++ b/.eslintrc.js @@ -0,0 +1,15 @@ +module.exports = { + // 继承 Eslint 规则 + extends: ["eslint:recommended"], + env: { + node: true, // 启用node中全局变量 + browser: true, // 启用浏览器中全局变量 + }, + parserOptions: { + ecmaVersion: 6, + sourceType: "module", + }, + rules: { + "no-var": 2, // 不能使用 var 定义变量 + }, +}; \ No newline at end of file diff --git a/.gitignore b/.gitignore index d5f19d8..897cb9f 100644 --- a/.gitignore +++ b/.gitignore @@ -1,2 +1,3 @@ node_modules package-lock.json +dist \ No newline at end of file diff --git a/package.json b/package.json index ea6d0d3..630c3c1 100644 --- a/package.json +++ b/package.json @@ -6,6 +6,7 @@ "scripts": { "test": "echo \"Error: no test specified\" && exit 1", "build": "webpack --mode development --config webpack.config.js", + "publish": "webpack --mode production --config webpack.config.js", "start": "webpack serve --open chrome.exe" }, "keywords": [], @@ -16,9 +17,10 @@ "@babel/preset-env": "^7.18.2", "any-touch": "^2.2.0", "babel-loader": "^8.2.5", - "clean-webpack-plugin": "^4.0.0", "core-js": "^3.22.8", "css-loader": "^6.7.1", + "eslint": "^8.17.0", + "eslint-webpack-plugin": "^3.1.1", "html-webpack-plugin": "^5.5.0", "less": "^4.1.2", "less-loader": "^11.0.0", diff --git a/src/index.html b/public/index.html similarity index 100% rename from src/index.html rename to public/index.html diff --git a/src/index.ts b/src/main.ts similarity index 100% rename from src/index.ts rename to src/main.ts diff --git a/webpack.config.js b/webpack.config.js index 854fffd..f0d0127 100644 --- a/webpack.config.js +++ b/webpack.config.js @@ -2,14 +2,14 @@ const path = require("path"); // 引入HTML插件 const HTMLWebpackPlugin = require("html-webpack-plugin"); -// 引入Clean插件 -const { CleanWebpackPlugin } = require("clean-webpack-plugin"); +// 引入EsLint插件 +const ESLintWebpackPlugin = require("eslint-webpack-plugin"); // webpack中的所有配置信息 module.exports = { - mode: "development", + mode: "production", // 指定入口文件 - entry: "./src/index.ts", + entry: "./src/main.ts", // 指定打包文件所在目录 output: { @@ -17,6 +17,8 @@ module.exports = { path: path.resolve(__dirname, "dist"), // 打包后的文件名 filename: "bundle.js", + // 自动清空上一次打包的内容,webpack4需使用扩展包clean-webpack-plugin插件来进行自动清空操作 + clean: true, // 不使用箭头函数的方式定义 environment: { @@ -97,9 +99,12 @@ module.exports = { // 配置webpack插件 plugins: [ - new CleanWebpackPlugin(), new HTMLWebpackPlugin({ - template: "./src/index.html" + template: "./public/index.html" + }), + new ESLintWebpackPlugin({ + // 指定检查文件的根目录 + context: path.resolve(__dirname, "src"), }) ],