Giter Site home page Giter Site logo

purge-fontawesome's People

Stargazers

 avatar

Watchers

 avatar

purge-fontawesome's Issues

Doesn't compile in laravel mix

Getting this error:
ERROR in ./node_modules/purge-fontawesome/pro-regular-svg-icons.js 1:20-94 Module not found: Error: Can't resolve '@fortawesome/pro-regular-svg-icons' in '/Users/gerhard/Code/Sites/Valet/gnarhard/node_modules/purge-fontawesome'

Had to change this:

const requireIcon = require.context('@fortawesome/pro-regular-svg-icons', true, /fa(.*)\.js$/);

To this:

var pathToModule = require.resolve('@fortawesome/pro-regular-svg-icons');
const requireIcon = require.context(pathToModule, true, /fa(.*)\.js$/);

Even then, It's compiling a whopping 3.19MiB. Here's my webpack.mix.js file:

const mix = require('laravel-mix');
const fs = require('fs-extra');
const browsersyncConf = 'browsersync.json';
const path = require('path');
const glob = require('glob');
require('dotenv').config();
require('laravel-mix-purgecss');

mix.js('resources/js/app.js', 'public/js').
    sass('resources/sass/app.scss', 'public/css', {
        additionalData: '$colorPrimary: ' + process.env.COLOR_PRIMARY +
            '; $colorSecondary: ' + process.env.COLOR_SECONDARY +
            '; $colorDark: ' + process.env.COLOR_DARK + '; $colorLight: ' +
            process.env.COLOR_LIGHT + ';',
    })
    .purgeCss({
        enabled: mix.inProduction(),
        folders: ['resources', 'views'],
        extensions: ['html', 'js', 'php'],
    })
    .extract([ 'bootstrap' ]);

const PurgeFontawesomePlugin = require('purge-fontawesome/webpack-plugin');

module.exports = {
    mode: 'production',
    entry: './resources/js/app.js',
    output: {
        path: path.resolve(__dirname, 'dist'),
        filename: 'bundle.js',
    },
    plugins: [
        new PurgeFontawesomePlugin({
            paths: [
                glob.sync(path.join(__dirname, '/resources/views/**/*'),  { nodir: true }),
            ],
        }),
    ],
};

if ( mix.inProduction() ) {
    mix.version();
} else {
    mix.sourceMaps();
    if ( process.env.sync ) { // Check if we are using npm run watch:sync

        if ( fs.pathExistsSync(browsersyncConf) ) { // Check to see if there is a browsersync configuration file exists

            const conf = JSON.parse(fs.readFileSync(browsersyncConf, 'utf8'));

            mix.browserSync(conf);

        } else {
            console.log('\x1b[31m%s\x1b[0m',
                'ERROR: No configuration file found for browser sync. If you want to use browsersync with this project then please add a browsersync.conf file to the root directory of this plugin.');
            process.exit(1);
        }
    }
}

I double checked that the directories it's scanning are correct.

NPM Version: 8.19.1
Laravel Mix (contains webpack) version: 6.0.6
package.json

{
    "private": true,
    "scripts": {
        "dev": "npm run development",
        "development": "mix",
        "watch": "mix watch",
        "watch:sync": "sync=1 mix watch",
        "watch-poll": "mix watch -- --watch-options-poll=1000",
        "hot": "mix watch --hot",
        "prod": "npm run production",
        "production": "mix --production"
    },
    "devDependencies": {
        "bootstrap": "^5.2.2",
        "browser-sync": "^2.11.2",
        "browser-sync-webpack-plugin": "^2.3.0",
        "fs-extra": "^11.0.0",
        "laravel-mix": "^6.0.6",
        "laravel-mix-purgecss": "^6.0.0",
        "postcss": "^8.1.14",
        "resolve-url-loader": "^5.0.0",
        "sass": "^1.32.11",
        "sass-loader": "^11.0.1"
    },
    "dependencies": {
        "purge-fontawesome": "^1.1.1",
        "@fortawesome/fontawesome-pro": "^6.2.0",
        "@fortawesome/fontawesome-svg-core": "^6.2.1",
        "@fortawesome/free-brands-svg-icons": "^6.2.1",
        "@fortawesome/free-regular-svg-icons": "^6.2.1",
        "@fortawesome/free-solid-svg-icons": "^6.2.1",
        "@fortawesome/pro-duotone-svg-icons": "^6.2.1",
        "@fortawesome/pro-light-svg-icons": "^6.2.1",
        "@fortawesome/pro-regular-svg-icons": "^6.2.1",
        "@fortawesome/pro-solid-svg-icons": "^6.2.1",
        "dotenv": "^16.0.3",
        "fslightbox": "^3.3.1",
        "html2canvas": "^1.4.1",
        "imagesloaded": "^5.0.0",
        "lozad": "^1.16.0",
        "markerjs2": "^2.27.0",
        "masonry-layout": "^4.2.2"
    }
}

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.