webpack 5
-
[Webpack 5] externals개발/Javascript 2022. 8. 8. 12:16
웹팩 설정에 externals라고 있습니다. 이 옵션은 번들 파일에서 의존성을 제외하는 방법을 제공합니다. 대신에 사용자 환경에 있는 의존성을 필요로 합니다. 공식문서에 나오는 표현인데 코드로 보면 이해가 빠를 겁니다. module.exports = { mode, entry: { main: "./src/app.js", }, output: { filename: "[name].js", path: path.resolve("./dist"), assetModuleFilename: "[name].[ext]?[hash]", }, devServer: { client: { overlay: true, logging: "error", }, proxy: { "/api": "http://localhost:8081", }, ho..
-
[Webpack 5] Optimization.minimizer개발/Javascript 2022. 8. 7. 16:44
webpack5에는 terser 플러그인이 내장되어 있습니다. 하지만 Optimization.minimizer 옵션을 커스텀해야 하거나 Terser 플러그인의 옵션을 넣어야 한다면 별도로 다운로드 해야 합니다. 이 경우 프로덕션 모드에서는 최적화를 수행하고 개발모드에선 수행하지 않도록 해야할 때 webpack4에서는 3항 연산자를 이용해야 했는데요. webpack5에서는 주석 한 줄이면 됩니다. optimization: { minimizer: [ // `...`, new CssMinimizerPlugin(), new TerserPlugin({ terserOptions: { compress: { drop_console: true, }, }, }), ], },