diff --git a/.eslintrc.yml b/.eslintrc.yml index 6c80e5f..0d9e06b 100644 --- a/.eslintrc.yml +++ b/.eslintrc.yml @@ -1,6 +1,7 @@ env: browser: true es2021: true + node: true extends: eslint:recommended overrides: [] parserOptions: diff --git a/package-lock.json b/package-lock.json index 70c51f7..0f30059 100644 --- a/package-lock.json +++ b/package-lock.json @@ -16,7 +16,8 @@ "style-loader": "^3.3.1", "webpack": "^5.75.0", "webpack-cli": "^5.0.1", - "webpack-dev-server": "^4.11.1" + "webpack-dev-server": "^4.11.1", + "webpack-merge": "^5.8.0" } }, "node_modules/@discoveryjs/json-ext": { diff --git a/package.json b/package.json index 9c2206a..76cd6a2 100644 --- a/package.json +++ b/package.json @@ -5,9 +5,9 @@ "private": true, "scripts": { "test": "echo \"Error: no test specified\" && exit 1", - "build": "webpack", - "lint": "eslint --ext .js,.jsx src", - "start": "webpack serve --open" + "build": "webpack --config webpack.prod.js", + "lint": "eslint --ext .js,.jsx src *.js", + "start": "webpack serve --open --config webpack.dev.js" }, "repository": { "type": "git", @@ -40,6 +40,7 @@ "style-loader": "^3.3.1", "webpack": "^5.75.0", "webpack-cli": "^5.0.1", - "webpack-dev-server": "^4.11.1" + "webpack-dev-server": "^4.11.1", + "webpack-merge": "^5.8.0" } } diff --git a/webpack.config.js b/webpack.common.js similarity index 59% rename from webpack.config.js rename to webpack.common.js index 180b39a..159f252 100644 --- a/webpack.config.js +++ b/webpack.common.js @@ -1,19 +1,14 @@ -const path = require('path'); -const HtmlWebpackPlugin = require('html-webpack-plugin'); +const path = require("path"); +const HtmlWebpackPlugin = require("html-webpack-plugin"); const MiniCssExtractPlugin = require("mini-css-extract-plugin"); const pages = ["index", "aes"]; module.exports = { - mode: 'development', entry: pages.reduce((config, page) => { config[page] = `./src/${page}.js`; return config; }, {}), - devtool: 'inline-source-map', - devServer: { - static: './dist', - }, output: { filename: "[name].js", path: path.resolve(__dirname, "dist"), @@ -30,21 +25,21 @@ module.exports = { chunkFilename: "[id].[contenthash].css", }), ].concat( - pages.map( - (page) => - new HtmlWebpackPlugin({ - inject: true, - template: `./src/pages/${page}.html`, - filename: `${page}.html`, - chunks: [page], - }) + pages.map( + (page) => + new HtmlWebpackPlugin({ + inject: true, + template: `./src/pages/${page}.html`, + filename: `${page}.html`, + chunks: [page], + }) ) ), module: { rules: [ { test: /\.css$/i, - use: [MiniCssExtractPlugin.loader, 'css-loader'], + use: [MiniCssExtractPlugin.loader, "css-loader"], }, ], }, diff --git a/webpack.dev.js b/webpack.dev.js new file mode 100644 index 0000000..23be62d --- /dev/null +++ b/webpack.dev.js @@ -0,0 +1,10 @@ +const { merge } = require("webpack-merge"); +const common = require("./webpack.common.js"); + +module.exports = merge(common, { + mode: "development", + devtool: "inline-source-map", + devServer: { + static: "./dist", + }, +}); diff --git a/webpack.prod.js b/webpack.prod.js new file mode 100644 index 0000000..f26f7c5 --- /dev/null +++ b/webpack.prod.js @@ -0,0 +1,7 @@ +const { merge } = require("webpack-merge"); +const common = require("./webpack.common.js"); + +module.exports = merge(common, { + mode: "production", + devtool: "source-map", +});