FullHuman/purgecss-webpack-plugin

TypeError: chunk.mapModules is not a function

Closed this issue · 12 comments

When I run the following code I get a "Not a function" error

mix.webpackConfig({
    plugins: [
        new purgeCss({
            paths: glob.sync([
                path.join(__dirname, 'resources/views/**/*.blade.php'),
                path.join(__dirname, 'resources/assets/app/js/**/*.vue')
            ]),
            extractors: [
                {
                    extractor: class {
                        static extract(content) {
                            return content.match(/[A-z0-9-:\/]+/g)
                        }
                    },
                    extensions: ['html', 'js', 'php', 'vue']
                }
            ]
        })
    ]
});

The console output is;

/project/node_modules/purgecss-webpack-plugin/lib/purgecss-webpack-plugin.js:148
    return chunk.mapModules(function (module) {
                 ^

TypeError: chunk.mapModules is not a function
    at files (/Library/WebServer/Documents/project/node_modules/purgecss-webpack-plugin/lib/purgecss-webpack-plugin.js:148:18)
    at /Library/WebServer/Documents/project/node_modules/purgecss-webpack-plugin/lib/purgecss-webpack-plugin.js:199:90
    at Array.forEach (native)
    at /Library/WebServer/Documents/project/node_modules/purgecss-webpack-plugin/lib/purgecss-webpack-plugin.js:195:39
    at Array.forEach (native)
    at Compilation.<anonymous> (/Library/WebServer/Documents/project/node_modules/purgecss-webpack-plugin/lib/purgecss-webpack-plugin.js:181:40)
    at next (/Library/WebServer/Documents/project/node_modules/tapable/lib/Tapable.js:204:14)
    at ExtractTextPlugin.<anonymous> (/Library/WebServer/Documents/project/node_modules/laravel-mix/node_modules/extract-text-webpack-plugin/index.js:345:4)
    at Compilation.applyPluginsAsyncSeries (/Library/WebServer/Documents/project/node_modules/tapable/lib/Tapable.js:206:13)
    at sealPart2 (/Library/WebServer/Documents/project/node_modules/webpack/lib/Compilation.js:627:9)
    at next (/Library/WebServer/Documents/project/node_modules/tapable/lib/Tapable.js:202:11)
    at Compilation.compilation.plugin (/Library/WebServer/Documents/project/node_modules/webpack/lib/ProgressPlugin.js:109:6)
    at next (/Library/WebServer/Documents/project/node_modules/tapable/lib/Tapable.js:204:14)
    at ExtractTextPlugin.<anonymous> (/Library/WebServer/Documents/project/node_modules/laravel-mix/node_modules/extract-text-webpack-plugin/index.js:317:5)
    at /Library/WebServer/Documents/project/node_modules/laravel-mix/node_modules/async/dist/async.js:473:16
    at iteratorCallback (/Library/WebServer/Documents/project/node_modules/laravel-mix/node_modules/async/dist/async.js:1050:13)
    at /Library/WebServer/Documents/project/node_modules/laravel-mix/node_modules/async/dist/async.js:958:16
    at /Library/WebServer/Documents/project/node_modules/laravel-mix/node_modules/extract-text-webpack-plugin/index.js:301:6
    at /Library/WebServer/Documents/project/node_modules/laravel-mix/node_modules/async/dist/async.js:473:16
    at iteratorCallback (/Library/WebServer/Documents/project/node_modules/laravel-mix/node_modules/async/dist/async.js:1050:13)
    at /Library/WebServer/Documents/project/node_modules/laravel-mix/node_modules/async/dist/async.js:958:16
    at /Library/WebServer/Documents/project/node_modules/laravel-mix/node_modules/extract-text-webpack-plugin/index.js:291:9
    at rebuilding.forEach.cb (/Library/WebServer/Documents/project/node_modules/webpack/lib/Compilation.js:500:29)
    at Array.forEach (native)
    at callback (/Library/WebServer/Documents/project/node_modules/webpack/lib/Compilation.js:500:15)
    at processModuleDependencies (/Library/WebServer/Documents/project/node_modules/webpack/lib/Compilation.js:519:5)
    at _combinedTickCallback (internal/process/next_tick.js:131:7)
    at process._tickCallback (internal/process/next_tick.js:180:9)

purgecss-webpack-plugin Version: 3.0.2
Webpack version: 3.10.0

Could you try to remove the node_modules direcory and then run npm install or yarn.
then try again?

If that doesn't work please try to update the npm package laravel-mix

@jsnanigans this is not a laravel-mix problem. Its the webpack plugin.

mapModules has been deprecated

webpack-contrib/extract-text-webpack-plugin#581

The mapModules function is used in this plugin.

Ah missed that, thanks.
We'll fix this asap

@jsnanigans you rock

@ciarans I'm not able to reproduce this issue. Would you be able to provide a minimal repo that contains the bug?
I looked at the issue you linked and could not find any mention of mapModules being deprecated in webpack 3.
To my knowledge, chunk.modules was deprecated and replace by chunk.mapModules. mapModules should not be deprecated before webpack 4.

I could also not recreate your issue @ciarans and could also not find any sign that mapModules is depricated... but after checking the webpack documentation on chunks, I decided to update

chunk.modules will be removed in webpack 4.

chunk.mapModules will be deprecated in webpack 4 and removed in 5.

Array.from(chunk.modulesIterable, fn) is recommended from webpack 4 onwards.

@jayjun im currently upgrading the plugin for webpack 4 and it seems that the chunks only have two keys on them [ 'mapModules', 'modules' ] and modulesIterable doesn't exists

maybe im doing something wrong
https://github.com/FullHuman/purgecss-webpack-plugin/blob/webpack-4/src/search.js#L29
called here:
https://github.com/FullHuman/purgecss-webpack-plugin/blob/webpack-4/src/index.js#L43

@jsnanigans modulesIterable was added in webpack 4. package.json is still pinned to "webpack": "^3.10.0".

@jayjun thats on the master branch, please have a look in the branch webpack-4

@jsnanigans Sorry, my bad.

modulesIterable is a getter, so it won’t show up with Object.keys(). But it’s weird that modules still show, because that’s completely gone from webpack 4.

Either way, I checked node_modules and modulesIterable is there.

in the branch webpack-4 this issue is resolved, soon we will be merging it into master but for the meantime please use purgecss-webpack-plugin@next if you are using webpack 4