const MiniCssExtractPlugin = require('mini-css-extract-plugin');
const vars = require('postcss-simple-vars');
const autoprefixer = require('autoprefixer');

const dirs = require('./dirs');

module.exports = {
    resolve: {
        mainFields: ['module', 'main'],
        extensions: ['.js', '.ts'],
        alias: {
            ui: dirs.UI,
            src: dirs.SRC,
            ReportCst: dirs.CONSTAINS,
            '@core': dirs.CORE,
            '@constants': dirs.CONST,
        },
    },

    module: {
        rules: [
            {
                test: /\.(js|ts)$/,
                include: [dirs.SRC, dirs.FINESHEET, dirs.AXIOS, dirs.RESIZER, dirs.LOCAL_FINESHEET, dirs.NODE_MODULES],
                use: [{
                    loader: 'babel-loader',
                    options: {
                        configFile: dirs.BABEL_CONFIG
                    },
                }, {
                    loader: 'source-map-loader',
                    options: {
                        enforce: 'pre'
                    }
                }]
            },
            {
                test: /\.(css|less)$/,
                use: [
                    MiniCssExtractPlugin.loader,
                    {
                        loader: 'css-loader',
                        options: {
                            url: false
                        }
                    },
                    {
                        loader: 'postcss-loader',
                        options: {
                            plugins: [vars({
                                variables: {
                                    fontUrl: '../node_modules/@fui/core/dist/font/',
                                    imageUrl: '/webroot/decision/resources?path=/com/fr/web/resources/dist/images/1x',
                                    image2xUrl: '/webroot/decision/resources?path=/com/fr/web/resources/dist/images/2x',
                                }
                            }), autoprefixer]
                        },
                    },
                    {
                        loader: 'less-loader',
                        options: {
                            relativeUrls: false
                        }
                    }
                ],
            },
        ],
    },
};