webpack ts react boilerplate

https://ryuhojin.tistory.com/19

[ReactJS] React + TypeScript + Webpack5 초기 설정 (리액트 18 공식 대응 완료)

위 글 작성자분의 webpack5 boilerplate 위에

//webpack.common.js
    new webpack.ProvidePlugin({
      React: "react",
      process: 'process/browser.js', //추가
    }),

process 못 찾는 에러 해결하기 위해 추가하고

//webpack.dev.js
const Dotenv = require('dotenv-webpack');
module.exports = merge(common, {
...
  plugins: [
    new Dotenv({ path: ".env" }), //추가
  ]
});

dev의 경우 .env를 잡게하고

const Dotenv = require('dotenv-webpack');
const CopyPlugin = require('copy-webpack-plugin');

module.exports = merge(common, {
...
  plugins: [
    new MiniCssExtractPlugin(),
    new Dotenv({ path: ".env.production" }), //추가
    new CopyPlugin({ //추가
      patterns: [{ from: "public/static", to: "static" }],
    })
  ],
  ...
});

product의 경우 .env.production을 잡도록 설정하고

정적 source는 copy-webpack-plugin 설치하고 public/static 에서 dist/static 으로 폴더 복사하도록 추가