EJSのビルドをwebpackで設定

EJSのビルドをwebpackで設定

EJSテンプレートをWebpackでビルドするには、ejs-loaderを使うのが便利です。
以下の手順で設定できます。

1. 必要なパッケージのインストール
必要なパッケージをインストールします。

npm install --save-dev webpack webpack-cli ejs-loader

2. webpack.config.jsの設定
webpack.config.jsに以下の設定を追加します。

const path = require('path');

module.exports = {
  entry: './src/index.js', // エントリーポイントを指定
  output: {
    filename: 'bundle.js',
    path: path.resolve(__dirname, 'dist'),
  },
  module: {
    rules: [
      {
        test: /\.ejs$/,
        use: [
          {
            loader: 'ejs-loader',
            options: {
              // ここでオプションを指定
            }
          }
        ]
      }
    ]
  },
  resolve: {
    extensions: ['.js', '.ejs']
  }
};

これでWebpackを使ってEJSテンプレートをビルドできるようになります。