diff options
Diffstat (limited to 'html/webpack.config.js')
-rw-r--r-- | html/webpack.config.js | 106 |
1 files changed, 106 insertions, 0 deletions
diff --git a/html/webpack.config.js b/html/webpack.config.js new file mode 100644 index 0000000..0285d96 --- /dev/null +++ b/html/webpack.config.js @@ -0,0 +1,106 @@ +const path = require('path'); +const { merge } = require('webpack-merge'); +const CopyWebpackPlugin = require('copy-webpack-plugin'); +const HtmlWebpackPlugin = require('html-webpack-plugin'); +const MiniCssExtractPlugin = require("mini-css-extract-plugin"); +const OptimizeCSSAssetsPlugin = require("optimize-css-assets-webpack-plugin"); +const TerserPlugin = require('terser-webpack-plugin'); + +const devMode = process.env.NODE_ENV !== 'production'; + +const baseConfig = { + context: path.resolve(__dirname, 'src'), + entry: { + app: './index.tsx' + }, + output: { + path: path.resolve(__dirname, 'dist'), + filename: devMode ? '[name].js' : '[name].[hash].js', + }, + module: { + rules: [ + { + test: /\.ts$/, + enforce: 'pre', + use: 'tslint-loader', + }, + { + test: /\.tsx?$/, + use: 'ts-loader', + exclude: /node_modules/ + }, + { + test: /\.s?[ac]ss$/, + use: [ + devMode ? 'style-loader' : MiniCssExtractPlugin.loader, + 'css-loader', + 'sass-loader', + ], + }, + ] + }, + resolve: { + extensions: [ '.tsx', '.ts', '.js' ] + }, + plugins: [ + new CopyWebpackPlugin({ + patterns:[ + { from: './favicon.png', to: '.' } + ], + }), + new MiniCssExtractPlugin({ + filename: devMode ? '[name].css' : '[name].[hash].css', + chunkFilename: devMode ? '[id].css' : '[id].[hash].css', + }), + new HtmlWebpackPlugin({ + inject: false, + minify: { + removeComments: true, + collapseWhitespace: true, + }, + title: 'ttyd - Terminal', + template: './template.html' + }) + ], + performance : { + hints : false + }, +}; + +const devConfig = { + mode: 'development', + devServer: { + contentBase: path.join(__dirname, 'dist'), + compress: true, + port: 9000, + proxy: [{ + context: ['/token', '/ws'], + target: 'http://localhost:7681', + ws: true + }] + }, + devtool: 'inline-source-map', +}; + +const prodConfig = { + mode: 'production', + optimization: { + minimizer: [ + new TerserPlugin({ + sourceMap: true + }), + new OptimizeCSSAssetsPlugin({ + cssProcessorOptions: { + map: { + inline: false, + annotation: true + } + } + }), + ] + }, + devtool: 'source-map', +}; + + +module.exports = merge(baseConfig, devMode ? devConfig : prodConfig); |