feat: 원 레포지토리의 JJoriping#1042 'Grunt 대신 WebPack 도입' 풀 리퀘스트를 적용함

Dockerfile

@@ -10,6 +10,4 @@ RUN yarn && yarn build
 
 RUN cd lib && node setup
 
-RUN cd lib && npx grunt default pack
-
 WORKDIR /kkutu

package.json

@@ -18,10 +18,6 @@
     "express-session": "^1.14.2",
     "glob": "^7.1.2",
     "glob-promise": "^3.3.0",
-    "grunt": "^1.0.4",
-    "grunt-cli": "^1.2.0",
-    "grunt-contrib-concat": "^1.0.1",
-    "grunt-contrib-uglify": "^2.1.0",
     "knex": "^2.3.0",
     "passport": "^0.4.0",
     "passport-daldalso": "^1.0.8",
@@ -41,7 +37,10 @@
     "pug": "^2.0.4",
     "redis": "^2.1.0",
     "request": "^2.88.2",
+    "terser-webpack-plugin": "^5.3.6",
     "tslog": "^3.3.4",
+    "webpack": "^5.74.0",
+    "webpack-cli": "^4.10.0",
     "ws": "^3.3.1"
   },
   "license": "GPL-3.0",
@@ -72,6 +71,7 @@
     "typescript": "^4.8.4"
   },
   "scripts": {
-    "build": "tsc"
+    "build": "tsc && webpack",
+    "webpack": "webpack"
   }
 }

src/Web/lib/in_game_kkutu.js

@@ -16,6 +16,8 @@
  * along with this program. If not, see <http://www.gnu.org/licenses/>.
  */
 
+(function(){
+
 var MODE;
 var BEAT = [ null,
 	"10000000",
@@ -4788,4 +4790,5 @@ function yell(msg){
  */
 
 delete window.WebSocket;
-delete window.setInterval;
+delete window.setInterval;
+})();

webpack.config.js

@@ -0,0 +1,96 @@
+const File = require("fs")
+const { resolve } = require("path")
+const { BannerPlugin } = require("webpack")
+const TerserPlugin = require("terser-webpack-plugin")
+
+const LICENSE = [
+  "Rule the words! KKuTu Online",
+  "Copyright (C) 2017 JJoriping(op@jjo.kr)",
+  "",
+  "This program is free software: you can redistribute it and/or modify",
+  "it under the terms of the GNU General Public License as published by",
+  "the Free Software Foundation, either version 3 of the License, or",
+  "(at your option) any later version.",
+  "",
+  "This program is distributed in the hope that it will be useful,",
+  "but WITHOUT ANY WARRANTY; without even the implied warranty of",
+  "MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the",
+  "GNU General Public License for more details.",
+  "",
+  "You should have received a copy of the GNU General Public License",
+  "along with this program. If not, see <http://www.gnu.org/licenses/>.",
+].join("\n")
+
+class ConcatPlugin {
+  constructor({ files, destination }) {
+    this.files = files
+    this.destination = destination
+  }
+  apply(compiler) {
+    const result = ["/**", LICENSE, "*/", "(function(){"]
+
+    compiler.hooks.beforeCompile.tap("ConcatPlugin", () => {
+      this.files
+        .filter((file) => File.existsSync(file))
+        .forEach((file) => result.push(File.readFileSync(file, "utf8")))
+      result.push("})();")
+      File.writeFileSync(this.destination, result.join("\n"), {
+        encoding: "UTF-8",
+      })
+    })
+  }
+}
+
+const sourcePath = resolve(__dirname, "lib/Web/lib")
+const gameSourcePath = resolve(sourcePath, "kkutu")
+const distributionPath = resolve(__dirname, "lib/Web/public/js")
+
+if (!File.existsSync(resolve(sourcePath, "in_game_kkutu.js")))
+  File.writeFileSync(resolve(sourcePath, "in_game_kkutu.js"))
+const files = File.readdirSync(sourcePath, { withFileTypes: true })
+  .filter((u) => u.isFile())
+  .map((u) => u.name)
+
+module.exports = {
+  mode: "production",
+  target: "web",
+  /*
+    inline-source-map은 개발 시 개발자 도구 이용을 쉽게 해 줍니다.
+    production mode에서는 주석 처리하는 것을 권장합니다. (파일 용량이 커짐)
+  */
+  // devtool: "inline-source-map",
+  entry: files.reduce((etr, file) => {
+    etr[file.substring(0, file.length - 3)] = resolve(sourcePath, file)
+    return etr
+  }, {}),
+  output: {
+    path: distributionPath,
+    filename: "[name].min.js",
+  },
+  plugins: [
+    new ConcatPlugin({
+      files: [
+        resolve(gameSourcePath, "head.js"),
+        resolve(gameSourcePath, "ready.js"),
+        resolve(gameSourcePath, "rule_classic.js"),
+        resolve(gameSourcePath, "rule_jaqwi.js"),
+        resolve(gameSourcePath, "rule_crossword.js"),
+        resolve(gameSourcePath, "rule_typing.js"),
+        resolve(gameSourcePath, "rule_hunmin.js"),
+        resolve(gameSourcePath, "rule_daneo.js"),
+        resolve(gameSourcePath, "rule_sock.js"),
+        resolve(gameSourcePath, "body.js"),
+        resolve(gameSourcePath, "tail.js"),
+      ],
+      destination: resolve(sourcePath, "in_game_kkutu.js"),
+    }),
+    new BannerPlugin(LICENSE),
+  ],
+  optimization: {
+    minimizer: [
+      new TerserPlugin({
+        extractComments: false,
+      }),
+    ],
+  },
+}