Untitled

var path = require('path');
var webpack = require('webpack');
const Dotenv = require('dotenv-webpack');
const BundleAnalyzerPlugin = require('webpack-bundle-analyzer').BundleAnalyzerPlugin;

require('dotenv').config({
    path: process.env.ENV_FILE || '.env.dev',
});

// Plugins
var CopyWebpackPlugin = require('copy-webpack-plugin');
var UglifyJsPlugin = require('uglifyjs-webpack-plugin');

// PostCss
var autoprefixer = require('autoprefixer');
var postcssVars = require('postcss-simple-vars');
var postcssImport = require('postcss-import');

const STATIC_PATH = process.env.STATIC_PATH || '/static';

const isProduction = process.env.NODE_ENV === 'production';

const config = {
    mode: isProduction ? 'production' : 'development',
    target: 'web',
    node: {
        fs: 'empty',
    },
    entry: {
        'scratch-gui': './scratch-gui/src/index.js'
    },
    output: {
        libraryTarget: 'umd',
        path: path.resolve(__dirname, 'build', 'scratch-gui', 'node'),
        publicPath: `${STATIC_PATH}/`,
        filename: '[name].js',
        chunkFilename: 'chunks/[name].js'
    },
    resolve: {
        symlinks: false,
    },
    module: {
        rules: [
            {
                test: /\.jsx?$/,
                sideEffects: false,
                loader: 'babel-loader',
                include: [
                    /* GUI source */
                    path.resolve(__dirname, './scratch-gui/src'),
                    /scratch-gui[\\/]node_modules[\\/]scratch-[^\\/]+[\\/]src/,
                    /scratch-gui[\\/]node_modules[\\/]pify/,
                    /scratch-gui[\\/]node_modules[\\/]@vernier[\\/]godirect/,

                    /* Shared source */
                    path.resolve(__dirname, './scratch-l10n'),
                    path.resolve(__dirname, './scratch-parser'),
                    path.resolve(__dirname, './scratch-vm/src/extension-support'),
                ],
                resolve: {
                    alias: {
                        'scratch-paint': path.resolve(__dirname, './build/scratch-paint/node/scratch-paint.js'),
                        'scratch-l10n/locales': path.resolve(__dirname, './scratch-l10n/locales'),
                        'scratch-l10n': path.resolve(__dirname, './scratch-l10n/dist/l10n.js'),
                        'scratch-vm': path.resolve(__dirname, './build/scratch-vm/node/scratch-vm.js'),
                        'scratch-blocks': path.resolve(__dirname, './scratch-blocks-1/dist/vertical.js'),
                        'scratch-render': path.resolve(__dirname, './build/scratch-render/node/scratch-render.js'),
                        'scratch-svg-renderer': path.resolve(__dirname, './scratch-svg-renderer/src/index.js'),
                        'scratch-parser': path.resolve(__dirname, './scratch-parser/index.js'),
                    },
                    extensions: ['.js', '.jsx']
                  },
                options: {
                    // Explicitly disable babelrc so we don't catch various config
                    // in much lower dependencies.
                    babelrc: false,
                    plugins: [
                        '@babel/plugin-syntax-dynamic-import',
                        '@babel/plugin-transform-async-to-generator',
                        '@babel/plugin-proposal-object-rest-spread',
                        ['react-intl', {
                            messagesDir: './translations/messages/'
                        }],
                        [
                            'import',
                            {
                                libraryName: 'antd',
                                libraryDirectory: 'es',
                                style: true,
                            },
                            'antd',
                        ],
                        [
                            "styled-components",
                            {
                            "displayName": true,
                            "preprocess": true
                            }
                        ],
                    ],
                    presets: [
                        ['@babel/preset-env', {targets: {browsers: ['last 3 versions', 'Safari >= 8', 'iOS >= 8']}}],
                        '@babel/preset-react'
                    ]
                }
            },
            {
                test: /\.css$/i,
                include: [
                    path.resolve(__dirname, './scratch-gui/src'),
                    path.resolve(__dirname, './node_modules')
                ],
                use: [
                    {
                        loader: 'style-loader'
                    },
                    {
                        loader: 'css-loader',
                        options: {
                            modules: true,
                            importLoaders: 1,
                            localIdentName: '[name]_[local]_[hash:base64:5]',
                            camelCase: true
                        }
                    },
                    {
                        loader: 'postcss-loader',
                        options: {
                            ident: 'postcss',
                            plugins: function () {
                                return [
                                    postcssImport,
                                    postcssVars,
                                    autoprefixer
                                ];
                            }
                        }
                    },
                ]
            },
            {
                test: /\.less$/i,
                include: [
                    path.resolve(__dirname, './scratch-gui/src'),
                    path.resolve(__dirname, './node_modules')
                ],
                use: [
                    'style-loader',
                    'css-loader',
                    {
                        loader: 'less-loader',
                        options: {
                            lessOptions: {
                                javascriptEnabled: true,
                            }
                        }
                    },
                ]
            },
            {
                test: /\.(svg|png|wav|mp3|gif|jpg)$/,
                loader: 'file-loader',
                include: [
                    path.resolve(__dirname, './scratch-gui/src')
                ],
                options: {
                    outputPath: 'static/assets/',
                    publicPath: `${STATIC_PATH}/assets/`
                }
            }
        ]
    },
    optimization: {
        minimizer: [
            new UglifyJsPlugin({
                include: /\.min\.js$/
            })
        ]
    },
    plugins: [
        new BundleAnalyzerPlugin(),
        new Dotenv({
            path: process.env.ENV_FILE || '.env.dev',
        }),
        new webpack.ProgressPlugin()
    ],
    externals: {
        'react': 'react',
        'react-dom': 'react-dom'
    }
}

if (!isProduction) {
    // config.devtool = 'cheap-module-source-map';
    config.devServer = {
        contentBase: false,
        // hot: true,
        host: '0.0.0.0',
        port: 8600,
        writeToDisk: true
    };
}

module.exports = config;