webpack 入門 以hugo為範例

創造.gitignore
public
static/assets

創造檔案 src/js/app.js
console.log('hello world');

安裝webpack
$yarn add -D webpack webpack-cli

創造檔案 webpack.config.js
const path = require('path');

module.exports = {
  entry: [path.resolve('src', 'js', 'app.js')],
  output: {
    path: path.resolve('static', 'assets'),
    filename: 'bundle.js',
  },
};


添加檔案package.json
{
  "scripts": {
    "start": "webpack --mode=development --watch",
    "build": "webpack --mode=production"
  },
  // ...
  "devDependencies": {
}

在baseof.html檔案底下</body></body>以上添加
引用
<script src="static/assets/bundle.js"></script>