examples/webpack_cli/webpack.config.js

const path = require('path')
const MiniCssExtractPlugin = require('mini-css-extract-plugin')
const { VanillaExtractPlugin } = require('@vanilla-extract/webpack-plugin')

const out_path = path.resolve(__dirname, 'dist')

module.exports = {
    entry: path.join(__dirname, 'index.js'),
    stats: 'verbose',
    mode: 'development',
    stats: 'detailed',
    resolve: {
        extensions: ['.js', '.ts'],
    },
    devtool: 'source-map',
    output: {
        filename: 'main.js',
        path: out_path,
    },
    module: {
        rules: [
            {
                test: /\.vanilla\.css$/i, // Targets only CSS files generated by vanilla-extract
                use: [
                    MiniCssExtractPlugin.loader,
                    {
                        loader: require.resolve('css-loader'),
                        options: {
                            url: false, // Required as image imports should be handled via JS/TS import statements
                        },
                    },
                ],
            },
        ],
    },
    plugins: [new VanillaExtractPlugin(), new MiniCssExtractPlugin()],
}