Skip to content

Instantly share code, notes, and snippets.

@dfravel
Created August 9, 2019 17:20
Show Gist options
  • Select an option

  • Save dfravel/d560243568da744a54587ffd2fd03fb1 to your computer and use it in GitHub Desktop.

Select an option

Save dfravel/d560243568da744a54587ffd2fd03fb1 to your computer and use it in GitHub Desktop.

Revisions

  1. dfravel created this gist Aug 9, 2019.
    43 changes: 43 additions & 0 deletions webpack.mix.js
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,43 @@
    const mix = require('laravel-mix');
    const ImageminPlugin = require('imagemin-webpack-plugin').default;

    require('laravel-mix-tailwind');
    require('laravel-mix-purgecss');

    const assetsPath = 'resources/assets';
    const distPath = './dist';
    const publicPath = '/wp-content/themes/THEME_NAME';

    mix.setPublicPath(distPath);
    mix.setResourceRoot('../');


    mix.webpackConfig({
    plugins: [
    new ImageminPlugin({
    pngquant: {
    quality: '95-100',
    },
    test: /\.(jpe?g|png|gif|svg)$/i,
    }),
    ],
    })

    mix.js(`${assetsPath}/scripts/main.js`, `${distPath}/js`);

    mix.sass(`${assetsPath}/styles/main.scss`, `${distPath}/styles/`)
    .options({
    processCssUrls: false,
    postCss: [require('tailwindcss')('./tailwind.config.js')],
    })
    .purgeCss({
    whitelistPatterns: [/flickity*/, /gform*/, /ginput*/, /validation*/, /fa-2x/, /fa-phone/, /fa-browser/, /fa-globe/, /fa-envelope/, /fa-twitter/, /fa-facebook/, /fa-instagram/, /fa-yelp/, /fa-linkedin/, /fa-check-circle/],
    whitelistPatternsChildren: [/flickity*/, /gform*/, /ginput*/],
    })
    .copyDirectory(`${assetsPath}/images`, `${distPath}/images/`, false)
    .copyDirectory(`${assetsPath}/webfonts`, `${distPath}/webfonts`)
    .copyDirectory('node_modules/@fortawesome/fontawesome-pro/webfonts', `${distPath}/fonts/`)

    if (mix.inProduction()) {
    mix.version()
    }