var HtmlWebpackPlugin = require('html-webpack-plugin');
module.exports = {
    entry: __dirname + "/src/auto/js/App.jsx",
    output: {
        filename: "bundle.js",
        path: __dirname + "/dist/var/www/html/"
    },

    // Enable sourcemaps for debugging webpack's output.
    devtool: "source-map",

    resolve: {
        // Add '.ts' and '.tsx' as resolvable extensions.
        extensions: [".ts", ".tsx", ".js", ".jsx", ".json"]
    },

    module: {
        rules: [
            {
                test: /\.jsx?$/,
                loader: 'babel-loader',
                exclude: /(node_modules|bower_components)/,
                options: {
                    presets: ['@babel/preset-env',
                              '@babel/preset-react'],
                    plugins: ['@babel/plugin-proposal-class-properties',
                    	['@babel/plugin-transform-runtime',
                    	      {
                    	        'regenerator': true
                    	      }
                    	],
                    	"babel-plugin-macros"
                    ]                    
                }
            },
            {
                test: /\.styl$/,
                use: [
                    'style-loader',
                    {
                        loader: 'css-loader',
                        options: {
                          modules: true,
                          localsConvention: 'camelCase',
                          importLoaders: 1,
                          // 0 => no loaders (default);
                          // 1 => postcss-loader;
                          // 2 => postcss-loader, sass-loader
                          modules: {
                              localIdentName: '[path][name]__[local]',
                            },
                        },
                      },
                    'stylus-loader'
                ]
            },
            {
                test: /\.css$/i,
                use: ['style-loader', 'css-loader'],
            },
            {
                test: /\.scss$/, // Match SCSS files
                use: [
                  'style-loader', // Inject styles into the DOM
                  'css-loader',   // Handle CSS imports
                  'sass-loader'   // Compile SCSS to CSS
                ],
              },
            // All files with a '.ts' or '.tsx' extension will be handled by 'awesome-typescript-loader'.
            { test: /\.tsx?$/, loader: "ts-loader" },

            // All output '.js' files will have any sourcemaps re-processed by 'source-map-loader'.
            { enforce: "pre", test: /\.js$/, loader: "source-map-loader" }
        ]
    },
    
    plugins: [
        new HtmlWebpackPlugin({
            filename: __dirname + '/dist/var/www/html/index.html',
            template: __dirname + '/src/auto/js/index.html'
        })
    ]
};