wp-base/webpack.mix.js at main · jehandev/wp-base · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
const mix                       = require('laravel-mix');
const CopyPlugin                = require("copy-webpack-plugin");
const ImageMinimizerPlugin      = require("image-minimizer-webpack-plugin");

let child         = process.env.WP_CHILD_THEME,
    buildChild    = child + 'assets/build/',
    distChild     = child + 'assets/dist/'
;

mix.webpackConfig({
    plugins: [
        new CopyPlugin({
            patterns: [
                {
                    from: buildChild + "images",
                    to: './images',
                    noErrorOnMissing: true,
                },
                {
                    from: buildChild + "fonts",
                    to: './fonts',
                    noErrorOnMissing: true,
                },
            ],
        }),
        new ImageMinimizerPlugin({
            minimizer: {
                implementation: ImageMinimizerPlugin.imageminMinify,
                options: {
                    plugins: [
                        "imagemin-gifsicle",
                        "imagemin-mozjpeg",
                        "imagemin-pngquant",
                        "imagemin-svgo"
                    ],
                }
            },
            generator: [
                {
                    // You can apply generator using `?as=webp`, you can use any name and provide more options
                    preset: "webp",
                    implementation: ImageMinimizerPlugin.imageminGenerate,
                    options: {
                        plugins: ["imagemin-webp"],
                    },
                },
                {
                    preset: "name",
                    filename: "generated-[name][ext]",
                    implementation: ImageMinimizerPlugin.sharpMinify,
                    // Options
                    options: {
                        encodeOptions: {
                            mozjpeg: {
                                quality: 90,
                            },
                        },
                    },
                },
            ],
        }),
    ]
});

mix.setPublicPath(distChild);

mix.options({
    processCssUrls: false,
    postCss: [
        require('postcss-import'),
        require('precss'),
        require('postcss-math'),
        require('postcss-combine-duplicated-selectors'),
        require('tailwindcss')
    ]
});

// Don't really know why setPublicPath is not working here
mix.babel([buildChild + 'js/frontend/*.js'], distChild + 'js/frontend.js').minify(distChild + 'js/frontend.js')

mix.postCss(buildChild + 'postcss/frontend.pcss', 'css/frontend.css').minify(distChild + 'css/frontend.css');

mix.sourceMaps()
    .version();