/** * Created by janis dähne */ const path = require('path') const webpack = require('webpack') const HtmlWebpackPlugin = require('html-webpack-plugin'); const CircularDependencyPlugin = require('circular-dependency-plugin') const CopyWebpackPlugin = require('copy-webpack-plugin'); const MiniCssExtractPlugin = require("mini-css-extract-plugin"); module.exports = { mode: "development", entry: { app: './src/index.tsx', // app2: './src/index2.tsx', }, output: { publicPath: "/", path: path.join(__dirname, 'dist'), filename: '[name]_bundle.js', chunkFilename: '[name].chunk.js' }, devtool: 'source-map', // if we want a source map!! for debugging saves ~5s for incremental bundle resolve: { // Add '.ts' and '.tsx' as resolvable extensions. extensions: [".ts", ".tsx", ".js", ".json", ".css"] }, devServer: { publicPath: '/', proxy: { '/static/ace-modes/*': { //a bit dirty because we use dist... but we cannot rename node_module mode files... //ace used file pattern: mode-[lang].js and files in brace/mode/are just [lang].js //on linux you can use mmv to batch rename target: 'http://localhost:8080/dist/static/ace-modes/', pathRewrite: {'^/static/ace-modes/': ''} } }, }, module: { rules: [ {test: /\.(jpe?g|gif|png|svg|woff|ttf|wav|mp3)$/, loader: "file-loader"}, //|css {test: /\.tsx?$/, loader: "awesome-typescript-loader", exclude: /node_modules/}, {enforce: "pre", test: /\.js$/, loader: "source-map-loader", exclude: /node_modules/}, { test: /\.(woff|woff2|eot|ttf)$/, loader: 'url-loader?limit=100000' }, { test: /\.css$/, loaders: [ 'style-loader?sourceMap', 'css-loader' ] }, { test: /\.styl$/, loader: 'style-loader!css-loader!stylus-loader' }, { test: /\.md$/, loader: 'raw-loader' } ] }, plugins: [ new webpack.DllReferencePlugin({ context: __dirname, manifest: require('./dist_nocopy/vendor_manifest.json') }), new MiniCssExtractPlugin({ filename: "styles.css", }), new HtmlWebpackPlugin({ hash: true, filename: 'index.html', template: 'htmlTemplates/index.ejs', inject: false, cache: false, //this is only for the template file minify: { caseSensitive: true, minifyCSS: true, collapseWhitespace: true, removeAttributeQuotes: true, removeComments: true } }), //not working, see https://github.com/webpack-contrib/copy-webpack-plugin#transformPath --> write-file-webpack-plugin but not needed //we need to mode dir once and then it should never change (probably) // new CopyWebpackPlugin([ // { // from: '../node_modules/brace/mode/*', // to: 'static/ace-modes/*', // }, // ]), new webpack.DefinePlugin({ 'process.env.NODE_ENV': '"development"' }), // new CircularDependencyPlugin({ // exclude: /a\.js|node_modules/, // allowAsyncCycles: false, // cwd: process.cwd(), // }), ], externals: { } }