From 3eea8a67230c83fb080832314b65c2114d8ab0e5 Mon Sep 17 00:00:00 2001 From: neki-dev Date: Sat, 12 Oct 2024 00:17:38 +0200 Subject: [PATCH] feat(webpack): update config --- package.json | 8 ++-- webpack/.client.js | 67 ------------------------------ webpack/.server.js | 30 -------------- webpack/.shared.js | 24 ----------- webpack/client/index.js | 80 ++++++++++++++++++++++++++++++++++++ webpack/client/tsconfig.json | 8 ++++ webpack/index.js | 4 +- webpack/server/index.js | 58 ++++++++++++++++++++++++++ webpack/server/tsconfig.json | 8 ++++ 9 files changed, 159 insertions(+), 128 deletions(-) delete mode 100644 webpack/.client.js delete mode 100644 webpack/.server.js delete mode 100644 webpack/.shared.js create mode 100644 webpack/client/index.js create mode 100644 webpack/client/tsconfig.json create mode 100644 webpack/server/index.js create mode 100644 webpack/server/tsconfig.json diff --git a/package.json b/package.json index 70614b1..71d185b 100644 --- a/package.json +++ b/package.json @@ -22,12 +22,11 @@ ], "scripts": { "start": "node ./dist/server.js", - "build:client": "webpack --config ./webpack/.client.js --mode=production", - "build:server": "webpack --config ./webpack/.server.js --mode=production", "build": "yarn build:server && yarn build:client", + "build:client": "webpack --config ./webpack/client/index.js --mode=production", + "build:server": "webpack --config ./webpack/server/index.js --mode=production", "watch": "webpack --config ./webpack/index.js --mode=development --watch", - "lint": "eslint \"./**/*.{js,ts,tsx}\" --ignore-path .gitignore --fix", - "format": "prettier --write \"src/**/*.{ts,tsx,json}\"" + "lint": "eslint \"./**/*.{js,ts,tsx}\" --ignore-path .gitignore --fix" }, "dependencies": { "dayjs": "1.11.5", @@ -60,7 +59,6 @@ "copy-webpack-plugin": "12.0.2", "eslint": "8.56.0", "eslint-plugin-import": "2.29.1", - "prettier": "3.0.3", "ts-loader": "9.5.1", "typescript": "5.5.3", "webpack": "5.93.0", diff --git a/webpack/.client.js b/webpack/.client.js deleted file mode 100644 index db99ab7..0000000 --- a/webpack/.client.js +++ /dev/null @@ -1,67 +0,0 @@ -const CopyPlugin = require("copy-webpack-plugin"); -const HtmlPlugin = require("html-webpack-plugin"); -const path = require("path"); -// const TerserPlugin = require("terser-webpack-plugin"); - -const sharedConfig = require("./.shared"); -const tsconfig = require("../tsconfig.json"); - -const ROOT = path.resolve(__dirname, ".."); -const OUTPUT = path.join(ROOT, tsconfig.compilerOptions.outDir, "public"); - -module.exports = (env, preset) => ({ - ...sharedConfig(env, preset), - name: "Client", - target: "web", - entry: path.join(ROOT, "src/client/index.tsx"), - output: { - path: OUTPUT, - filename: "bundle.[fullhash].js", - clean: true, - }, - module: { - rules: [ - { - test: /\.tsx?$/, - exclude: /node_modules/, - use: ["babel-loader", "ts-loader"], - }, - { - test: /\.(svg|png|ttf|woff|woff2)$/, - exclude: /node_modules/, - type: "asset/resource", - generator: { - filename: "assets/[hash][ext]", - }, - }, - ], - }, - plugins: [ - new HtmlPlugin({ - minify: false, - template: "src/client/index.html", - }), - new CopyPlugin({ - patterns: [ - { - from: path.join(ROOT, "src/client/assets"), - to: path.join(OUTPUT, "assets"), - }, - ], - }), - ], - devtool: preset.mode === "development" ? "inline-source-map" : "source-map", - optimization: - preset.mode === "development" - ? undefined - : { - minimize: true, - // minimizer: [ - // new TerserPlugin({ - // terserOptions: { - // output: { comments: false }, - // }, - // }), - // ], - }, -}); diff --git a/webpack/.server.js b/webpack/.server.js deleted file mode 100644 index d7fc61e..0000000 --- a/webpack/.server.js +++ /dev/null @@ -1,30 +0,0 @@ -const path = require("path"); - -const sharedConfig = require("./.shared"); -const tsconfig = require("../tsconfig.json"); - -const ROOT = path.resolve(__dirname, ".."); - -module.exports = (env, preset) => ({ - ...sharedConfig(env, preset), - name: "Server", - target: "node", - entry: path.join(ROOT, "src/server/index.ts"), - output: { - path: path.join(ROOT, tsconfig.compilerOptions.outDir), - filename: "server.js", - }, - module: { - rules: [ - { - test: /\.ts$/, - exclude: /node_modules/, - use: ["ts-loader"], - }, - ], - }, - externals: ["bufferutil", "utf-8-validate"], - optimization: { - minimize: false, - }, -}); diff --git a/webpack/.shared.js b/webpack/.shared.js deleted file mode 100644 index 9f4dce3..0000000 --- a/webpack/.shared.js +++ /dev/null @@ -1,24 +0,0 @@ -/* eslint-disable import/no-extraneous-dependencies */ -const alias = require("alias-reuse"); -const path = require("path"); - -const root = path.resolve(__dirname, ".."); -const tsconfig = path.resolve(root, "tsconfig.json"); - -module.exports = (env, preset) => ({ - resolve: { - extensions: [".js", ".ts", ".tsx"], - alias: alias.reuse().from(tsconfig).for("webpack"), - }, - performance: { - hints: false, - }, - stats: { - all: false, - builtAt: true, - errors: true, - warnings: true, - timings: true, - colors: true, - }, -}); diff --git a/webpack/client/index.js b/webpack/client/index.js new file mode 100644 index 0000000..d25608c --- /dev/null +++ b/webpack/client/index.js @@ -0,0 +1,80 @@ +/* eslint-disable @typescript-eslint/no-var-requires */ +/* eslint-disable no-undef */ + +const alias = require("alias-reuse"); +const CopyPlugin = require("copy-webpack-plugin"); +const HtmlPlugin = require("html-webpack-plugin"); +const path = require("path"); + +const ROOT = path.resolve(__dirname, "../.."); +const OUTPUT = path.resolve(ROOT, "dist/public"); + +const tsconfig = path.resolve(ROOT, 'tsconfig.json'); + +module.exports = () => ({ + name: "Client", + target: "web", + entry: path.resolve(ROOT, "src/client/index.tsx"), + resolve: { + extensions: [".js", ".ts", ".tsx"], + alias: alias.reuse().from(tsconfig).for("webpack"), + }, + output: { + path: OUTPUT, + filename: "bundle.[fullhash].js", + clean: true, + }, + devtool: "source-map", + module: { + rules: [ + { + test: /\.tsx?$/, + use: [ + { + loader: "babel-loader", + }, + { + loader: "ts-loader", + options: { + configFile: path.resolve(__dirname, "tsconfig.json"), + }, + }, + ], + include: /src\/(client|shared)/, + }, + { + test: /\.(svg|png|ttf|woff|woff2)$/, + exclude: /node_modules/, + type: "asset/resource", + generator: { + filename: "assets/[hash][ext]", + }, + }, + ], + }, + plugins: [ + new HtmlPlugin({ + minify: false, + template: "src/client/index.html", + }), + new CopyPlugin({ + patterns: [ + { + from: path.resolve(ROOT, "src/client/assets"), + to: path.resolve(OUTPUT, "assets"), + }, + ], + }), + ], + performance: { + hints: false, + }, + stats: { + all: false, + builtAt: true, + errors: true, + warnings: true, + timings: true, + colors: true, + }, +}); diff --git a/webpack/client/tsconfig.json b/webpack/client/tsconfig.json new file mode 100644 index 0000000..38009a2 --- /dev/null +++ b/webpack/client/tsconfig.json @@ -0,0 +1,8 @@ +{ + "extends": "../../tsconfig", + "include": [ + "../../src/client/**/*.ts", + "../../src/shared/**/*.ts", + "../../src/*.d.ts" + ] +} diff --git a/webpack/index.js b/webpack/index.js index 4de8154..b4e086a 100644 --- a/webpack/index.js +++ b/webpack/index.js @@ -1,5 +1,5 @@ /* eslint-disable global-require */ module.exports = [ - require('./.server'), - require('./.client'), + require('./server'), + require('./client'), ]; diff --git a/webpack/server/index.js b/webpack/server/index.js new file mode 100644 index 0000000..9ce4797 --- /dev/null +++ b/webpack/server/index.js @@ -0,0 +1,58 @@ +/* eslint-disable @typescript-eslint/no-var-requires */ +/* eslint-disable no-undef */ + +const alias = require("alias-reuse"); +const path = require("path"); + +const ROOT = path.resolve(__dirname, "../.."); + +const tsconfig = path.resolve(ROOT, 'tsconfig.json'); + +module.exports = () => ({ + name: "Server", + target: "node", + entry: path.resolve(ROOT, "src/server/index.ts"), + resolve: { + extensions: [".js", ".ts"], + alias: alias.reuse().from(tsconfig).for("webpack"), + }, + output: { + path: path.resolve(ROOT, "dist"), + filename: "server.js", + }, + devtool: "source-map", + module: { + rules: [ + { + test: /\.ts$/, + use: [ + { + loader: "ts-loader", + options: { + configFile: path.resolve(__dirname, "tsconfig.json"), + }, + }, + ], + include: /src\/(server|shared)/, + }, + ], + }, + externals: [ + "bufferutil", + "utf-8-validate", + ], + optimization: { + minimize: false, + }, + performance: { + hints: false, + }, + stats: { + all: false, + builtAt: true, + errors: true, + warnings: true, + timings: true, + colors: true, + }, +}); diff --git a/webpack/server/tsconfig.json b/webpack/server/tsconfig.json new file mode 100644 index 0000000..b10d760 --- /dev/null +++ b/webpack/server/tsconfig.json @@ -0,0 +1,8 @@ +{ + "extends": "../../tsconfig", + "include": [ + "../../src/server/**/*.ts", + "../../src/shared/**/*.ts", + "../../src/*.d.ts" + ] +}