サーバーサイドのnode_modulesをminifyしてコンテナ化する方法
累計閲覧数 304 PV
node_modules
をそのままイメージ内にCOPY(ADD)するwebpack
でminifyするnode server.js
で実行できる状態にするrequire
の解決時間が短くなる
webpack 4のざっくりとした設定は次の通り。
import * as webpack from "webpack";
const isProduction = process.env.NODE_ENV === "production";
const outputName = isProduction ? "server.prod.js" : "server.dev.js";
const useMinimize = false;
export const config: webpack.Configuration = {
mode: isProduction,
entry: {
[outputName]: "./src/index.ts",
},
optimization: {
minimize: useMinimize,
noEmitOnErrors: true,
},
devtool: isProduction ? undefined : "inline-source-map",
target: "node",
resolve: {
extensions: [".js", ".ts", ".tsx"],
alias: {
grpc: "@grpc/grpc-js", // https://github.com/grpc/grpc-node/issues/1185
},
},
module: {
rules: [ /** 各種loader */ ],
},
output: {
path: "dist",
filename: "[name].js",
libraryTarget: "commonjs2", // commonjsとしてoutputする
},
plugins: [
new webpack.DefinePlugin({
"process.env.NODE_ENV": JSON.stringify(process.env.NODE_ENV || "production"),
"global.GENTLY": false, // https://github.com/node-formidable/node-formidable/issues/337#issuecomment-153408479
}),
],
},
ただし、ビルドするコードは次のようなものを含んではいけない。
Bad
const sampleCode = (dynamicPath: string) => {
const someModule = require(dynamicPath); // 動的なrequire
// use someModule
};
Workaround
webpack.DefinePlugin
で該当箇所のコードが含まれないようにするwebpack.resolve.alias
を利用して動的なrequireを含まないライブラリに置換するfs
ライブラリなどで実行時にファイルを読み込みができないBad
// in library
import * as fs from "fs";
const getConfig = () => {
return fs.readFileSync(__dirname + "/config.json");
};
Workaround
json
の読み込みで利用している場合、import
もしくはrequire
に置き換えるprocess.env.NODE_ENV !== "production"
でラップしてproduction
ビルド時はDead Codeにする