webpack.common.js

const {
    ProvidePlugin,
    LoaderOptionsPlugin,
    EnvironmentPlugin
} = require('webpack');
const ExtractTextPlugin = require('extract-text-webpack-plugin');
const { join } = require('path');

const paths = {
    app: './examples/src/app',
    dist: join(__dirname, '/examples/dist'),
    lib: join(__dirname, 'src/lib')
};

module.exports = {
    entry: [paths.app],
    output: {
        path: paths.dist,
        filename: 'floweditor.js',
        publicPath: ''
    },
    resolve: {
        extensions: ['.ts', '.tsx', '.js']
    },
    plugins: [
        new ProvidePlugin({
            $: 'jquery',
            jQuery: 'jquery'
        }),
        new EnvironmentPlugin({
            NODE_ENV: 'development',
            DEBUG: false
        }),
        new ExtractTextPlugin('styles.css'),
        new LoaderOptionsPlugin({
            minimize: true,
            debug: false
        })
    ],
    module: {
        rules: [
            {
                test: /\.woff(2)?(\?[a-z0-9]+)?$/,
                loader: 'url-loader?limit=10000&mimetype=application/font-woff'
            },
            {
                test: /\.(ttf|eot|svg)(\?[a-z0-9]+)?$/,
                loader: 'file-loader',
                options: {
                    name: 'fonts/[hash].[ext]'
                }
            },
            {
                test: /\.scss$/,
                include: paths.lib,
                use: ['css-hot-loader'].concat(
                    ExtractTextPlugin.extract({
                        fallback: 'style-loader',
                        use: [
                            {
                                loader: 'typings-for-css-modules-loader',
                                query: {
                                    modules: true,
                                    banner:
                                        '// This file is automatically generated by the "typings-for-css-modules" Webpack loader.\n// https://github.com/Jimdo/typings-for-css-modules-loader\n',
                                    namedExport: true,
                                    camelCase: true,
                                    sourceMap: true,
                                    importLoaders: 2,
                                    localIdentName:
                                        '[name]__[local]___[hash:base64:5]'
                                }
                            },
                            {
                                loader: 'postcss-loader',
                                options: {
                                    ident: 'postcss',
                                    plugins: () => [require('autoprefixer')()]
                                }
                            },
                            'sass-loader'
                        ]
                    })
                )
            },
            {
                test: /\.css$/,
                exclude: paths.lib,
                use: ['style-loader', 'css-loader']
            },
            {
                test: /\.tsx?$/,
                use: [
                    {
                        loader: 'awesome-typescript-loader',
                        options: {
                            useBabel: true,
                            useCache: true,
                            silent: process.argv.indexOf('--json') !== -1
                        }
                    }
                ],
                exclude: /node_modules/
            },
            {
                test: /\.scss$/,
                exclude: paths.lib,
                use: [
                    { loader: 'style-loader' },
                    { loader: 'css-loader' },
                    { loader: 'sass-loader' }
                ]
            }
        ]
    }
};