darrenscerri / duplicate-package-checker-webpack-plugin Goto Github PK
View Code? Open in Web Editor NEWπ΅οΈ Webpack plugin that warns you when a build contains multiple versions of the same package
License: MIT License
π΅οΈ Webpack plugin that warns you when a build contains multiple versions of the same package
License: MIT License
I have added this plugin to devDependencies, and here is my webpack.config.js:
var DuplicatePackageCheckerPlugin = require("duplicate-package-checker-webpack-plugin");
module.exports = {
plugins: [new DuplicatePackageCheckerPlugin({
verbose: true,
})]
};
Problem: neither yarn build
nor yarn start
complain about this duplicate package:
$ grep aws-amplify yarn.lock
aws-amplify-react@^0.1.52:
resolved "https://registry.yarnpkg.com/aws-amplify-react/-/aws-amplify-react-0.1.52.tgz#0080a10ad14447a4a33ebe3855917c98ed009148"
aws-amplify "^0.4.6"
aws-amplify@^0.3.4:
resolved "https://registry.yarnpkg.com/aws-amplify/-/aws-amplify-0.3.4.tgz#fc7e9398a51f6d071f3e3dd50017509b67efedfc"
aws-amplify@^0.4.6:
resolved "https://registry.yarnpkg.com/aws-amplify/-/aws-amplify-0.4.6.tgz#aa6485876ca37c75b600883be52924be78b2840f"
I am a newbie with webpack and yarn, so I am probably overlooking something obvious. Any pointers would be gratefully appreciated.
I'm getting the following error when using this plugin with webpack 3.11.0. When looking at the compiler source for v3.11.0
I don't see this.hooks.emit
, but I do see it when looking at version v4.0.0.
Is this plugin only compatible with certain webpack versions? If so, can you update the docs with version compatibility info?
Thanks!
TypeError: Cannot read property 'emit' of undefined
at DuplicatePackageCheckerPlugin.apply (/Users/philipwalton/Projects/philipwalton/blog/node_modules/duplicate-package-checker-webpack-plugin/lib/index.js:59:18)
at Compiler.apply (/Users/philipwalton/Projects/philipwalton/blog/node_modules/tapable/lib/Tapable.js:375:16)
at webpack (/Users/philipwalton/Projects/philipwalton/blog/node_modules/webpack/lib/webpack.js:33:19)
at createCompiler (/Users/philipwalton/Projects/philipwalton/blog/tasks/javascript.js:211:20)
at gulp.task (/Users/philipwalton/Projects/philipwalton/blog/tasks/javascript.js:239:27)
at <anonymous>
at process._tickCallback (internal/process/next_tick.js:188:7)
Hi,
First, thanks for the package.
I'm having an error with a duplicate package, which is what I wanted, but the problem is that the duplicates are found inside node_modules
, so I do not have the possibility to modify it.
It would be great to have an option to throw an error only when one of the duplicate is found in one of my own files.
I ignore if this is possible, but could be useful to add a report to stats generated by webpack instead of outputting the result of the inspection.
I'm using webpack from another application and I expect the output to be a JSON (using --json option).
If not possible, consider outputting your result to a specified file instead like this other plugin is doing BundleAnalyzer
Hello, thanks for this project!
I've got following warning on my projects:
WARNING in duplicate-package-checker:
<undefined>
undefined ./~/date-fns/parse
undefined ./~/date-fns/compare_asc
undefined ./~/date-fns/compare_desc
undefined ./~/date-fns/difference_in_calendar_months
undefined ./~/date-fns/difference_in_milliseconds
undefined ./~/date-fns/difference_in_months
undefined ./~/date-fns/difference_in_seconds
undefined ./~/date-fns/distance_in_words
undefined ./~/date-fns/distance_in_words_to_now
undefined ./~/date-fns/is_date
undefined ./~/date-fns/locale/_lib
undefined ./~/date-fns/locale/en
(node:87351) [DEP_WEBPACK_MODULE_ISSUER] DeprecationWarning: Module.issuer: Use new ModuleGraph API
at Function.getModuleGraphForModule (<project>/node_modules/webpack/lib/ModuleGraph.js:1339:10)
at NormalModule.get issuer [as issuer] (<project>/node_modules/webpack/lib/Module.js:236:22)
at <project>/node_modules/duplicate-package-checker-webpack-plugin/lib/index.js:105:29
at Set.forEach (<anonymous>)
at <project>/node_modules/duplicate-package-checker-webpack-plugin/lib/index.js:74:25
at _next3 (eval at create (<project>/node_modules/webpack/node_modules/tapable/lib/HookCodeFactory.js:33:10), <anonymous>:8:1)
at eval (eval at create (<project>/node_modules/webpack/node_modules/tapable/lib/HookCodeFactory.js:33:10), <anonymous>:22:1)
at <project>/node_modules/html-webpack-plugin/index.js:290:11
at runMicrotasks (<anonymous>)
at processTicksAndRejections (internal/process/task_queues.js:94:5)
duplicate-package-checker-webpack-plugin/src/index.js
Lines 106 to 110 in f78729d
That's not really a bug i guess, but it looks weird, on windows you will get smth like: ./~/my\duplicated\module.js
as an issuer.
see https://github.com/darrenscerri/duplicate-package-checker-webpack-plugin/blob/master/src/index.js#L20
It seems like the plugin does a bunch of FS calls for every single file. This can cause build performance issues in large projects.
Could you consider caching some results? For example if I put a lot before fs.existsSync
check in find-root
, I see output like this for a tiny project that just imports react
and react-dom
:
checking /Users/dan/Projects/create-react-app/node_modules/object-assign/index.js
checking /Users/dan/Projects/create-react-app/node_modules/object-assign
checking /Users/dan/Projects/create-react-app/node_modules/react/index.js
checking /Users/dan/Projects/create-react-app/node_modules/react
checking /Users/dan/Projects/create-react-app/node_modules/fbjs/lib/emptyFunction.js
checking /Users/dan/Projects/create-react-app/node_modules/fbjs/lib
checking /Users/dan/Projects/create-react-app/node_modules/fbjs
checking /Users/dan/Projects/create-react-app/node_modules/promise/lib/core.js
checking /Users/dan/Projects/create-react-app/node_modules/promise/lib
checking /Users/dan/Projects/create-react-app/node_modules/promise
checking /Users/dan/Projects/create-react-app/node_modules/fbjs/lib/emptyObject.js
checking /Users/dan/Projects/create-react-app/node_modules/fbjs/lib
checking /Users/dan/Projects/create-react-app/node_modules/fbjs
checking /Users/dan/Projects/create-react-app/packages/react-scripts/config/polyfills.js
checking /Users/dan/Projects/create-react-app/packages/react-scripts/config
checking /Users/dan/Projects/create-react-app/packages/react-scripts
checking /Users/dan/Projects/create-react-app/node_modules/promise/lib/rejection-tracking.js
checking /Users/dan/Projects/create-react-app/node_modules/promise/lib
checking /Users/dan/Projects/create-react-app/node_modules/promise
checking /Users/dan/Projects/create-react-app/node_modules/asap/browser-raw.js
checking /Users/dan/Projects/create-react-app/node_modules/asap
checking /Users/dan/Projects/create-react-app/node_modules/webpack/buildin/global.js
checking /Users/dan/Projects/create-react-app/node_modules/webpack/buildin
checking /Users/dan/Projects/create-react-app/node_modules/webpack
checking /Users/dan/Projects/create-react-app/node_modules/promise/lib/es6-extensions.js
checking /Users/dan/Projects/create-react-app/node_modules/promise/lib
checking /Users/dan/Projects/create-react-app/node_modules/promise
checking /Users/dan/Projects/create-react-app/node_modules/whatwg-fetch/fetch.js
checking /Users/dan/Projects/create-react-app/node_modules/whatwg-fetch
checking /Users/dan/Projects/create-react-app/packages/react-scripts/template/src/index.js
checking /Users/dan/Projects/create-react-app/packages/react-scripts/template/src
checking /Users/dan/Projects/create-react-app/packages/react-scripts/template
checking /Users/dan/Projects/create-react-app/packages/react-scripts
checking /Users/dan/Projects/create-react-app/node_modules/react/cjs/react.production.min.js
checking /Users/dan/Projects/create-react-app/node_modules/react/cjs
checking /Users/dan/Projects/create-react-app/node_modules/react
checking /Users/dan/Projects/create-react-app/node_modules/react-dom/index.js
checking /Users/dan/Projects/create-react-app/node_modules/react-dom
checking /Users/dan/Projects/create-react-app/node_modules/react-dom/cjs/react-dom.production.min.js
checking /Users/dan/Projects/create-react-app/node_modules/react-dom/cjs
checking /Users/dan/Projects/create-react-app/node_modules/react-dom
checking /Users/dan/Projects/create-react-app/node_modules/fbjs/lib/ExecutionEnvironment.js
checking /Users/dan/Projects/create-react-app/node_modules/fbjs/lib
checking /Users/dan/Projects/create-react-app/node_modules/fbjs
checking /Users/dan/Projects/create-react-app/node_modules/fbjs/lib/EventListener.js
checking /Users/dan/Projects/create-react-app/node_modules/fbjs/lib
checking /Users/dan/Projects/create-react-app/node_modules/fbjs
checking /Users/dan/Projects/create-react-app/node_modules/fbjs/lib/getActiveElement.js
checking /Users/dan/Projects/create-react-app/node_modules/fbjs/lib
checking /Users/dan/Projects/create-react-app/node_modules/fbjs
checking /Users/dan/Projects/create-react-app/node_modules/fbjs/lib/shallowEqual.js
checking /Users/dan/Projects/create-react-app/node_modules/fbjs/lib
checking /Users/dan/Projects/create-react-app/node_modules/fbjs
checking /Users/dan/Projects/create-react-app/node_modules/fbjs/lib/containsNode.js
checking /Users/dan/Projects/create-react-app/node_modules/fbjs/lib
checking /Users/dan/Projects/create-react-app/node_modules/fbjs
checking /Users/dan/Projects/create-react-app/node_modules/fbjs/lib/isTextNode.js
checking /Users/dan/Projects/create-react-app/node_modules/fbjs/lib
checking /Users/dan/Projects/create-react-app/node_modules/fbjs
checking /Users/dan/Projects/create-react-app/node_modules/fbjs/lib/isNode.js
checking /Users/dan/Projects/create-react-app/node_modules/fbjs/lib
checking /Users/dan/Projects/create-react-app/node_modules/fbjs
checking /Users/dan/Projects/create-react-app/node_modules/fbjs/lib/focusNode.js
checking /Users/dan/Projects/create-react-app/node_modules/fbjs/lib
checking /Users/dan/Projects/create-react-app/node_modules/fbjs
checking /Users/dan/Projects/create-react-app/packages/react-scripts/template/src/index.css
checking /Users/dan/Projects/create-react-app/packages/react-scripts/template/src
checking /Users/dan/Projects/create-react-app/packages/react-scripts/template
checking /Users/dan/Projects/create-react-app/packages/react-scripts
checking /Users/dan/Projects/create-react-app/packages/react-scripts/template/src/App.js
checking /Users/dan/Projects/create-react-app/packages/react-scripts/template/src
checking /Users/dan/Projects/create-react-app/packages/react-scripts/template
checking /Users/dan/Projects/create-react-app/packages/react-scripts
checking /Users/dan/Projects/create-react-app/packages/react-scripts/template/src/logo.svg
checking /Users/dan/Projects/create-react-app/packages/react-scripts/template/src
checking /Users/dan/Projects/create-react-app/packages/react-scripts/template
checking /Users/dan/Projects/create-react-app/packages/react-scripts
checking /Users/dan/Projects/create-react-app/packages/react-scripts/template/src/App.css
checking /Users/dan/Projects/create-react-app/packages/react-scripts/template/src
checking /Users/dan/Projects/create-react-app/packages/react-scripts/template
checking /Users/dan/Projects/create-react-app/packages/react-scripts
checking /Users/dan/Projects/create-react-app/packages/react-scripts/template/src/registerServiceWorker.js
checking /Users/dan/Projects/create-react-app/packages/react-scripts/template/src
checking /Users/dan/Projects/create-react-app/packages/react-scripts/template
checking /Users/dan/Projects/create-react-app/packages/react-scripts
checking /Users/dan/Projects/create-react-app/packages/react-scripts/template/src/index.css
checking /Users/dan/Projects/create-react-app/packages/react-scripts/template/src
checking /Users/dan/Projects/create-react-app/packages/react-scripts/template
checking /Users/dan/Projects/create-react-app/packages/react-scripts
checking /Users/dan/Projects/create-react-app/node_modules/css-loader/lib/css-base.js
checking /Users/dan/Projects/create-react-app/node_modules/css-loader/lib
checking /Users/dan/Projects/create-react-app/node_modules/css-loader
checking /Users/dan/Projects/create-react-app/node_modules/style-loader/lib/addStyles.js
checking /Users/dan/Projects/create-react-app/node_modules/style-loader/lib
checking /Users/dan/Projects/create-react-app/node_modules/style-loader
checking /Users/dan/Projects/create-react-app/node_modules/style-loader/lib/urls.js
checking /Users/dan/Projects/create-react-app/node_modules/style-loader/lib
checking /Users/dan/Projects/create-react-app/node_modules/style-loader
checking /Users/dan/Projects/create-react-app/packages/react-scripts/template/src/App.css
checking /Users/dan/Projects/create-react-app/packages/react-scripts/template/src
checking /Users/dan/Projects/create-react-app/packages/react-scripts/template
checking /Users/dan/Projects/create-react-app/packages/react-scripts
There might be some opportunities to improve here.
For example when we learn the root for packages/react-scripts/template/src/App.css
by traversing upwards, we can memoize that it's also the root for packages/react-scripts/template/src/
and packages/react-scripts/template/
.
Then next time we traverse we can short-circuit instead of checking it again.
I would suggest taking a large project (>1000 files) and profiling the build time with and without this plugin. If there is a noticeable difference it's worth trying to cache more things.
This plugin currently informs me of duplicates where one of the instances comes from webpack-dev-server
. Ideally it'd be nice if this plugin simply ignores files from that module to reduce noise, or potentially even provides an optional function for consumers to identify whatever they deem a false positive. Maybe something like:
new DuplicatePackageCheckerPlugin({
emitError: false,
isFalsePositive: function () {
// add custom logic here that returns true when we deem this is a false positive.
// this will require useful information via argument(s) for custom logic
return false;
},
verbose: true,
})
First off, thanks for this plugin! I'm running into a small issue when generating and uploading json stats to the various analyzer tools which is caused by this line in the output stats.json
file:
Not sure if you can control it outputting there or maybe if there's something I need to add to my config. Either way, any advice would be much appreciated as I'd like to keep using this plugin but also figure out how to make it play nice with the stats output. Maybe the warnings/errors can be included somewhere in the actual JSON.
The problem that I am facing using this plugin is, it does not inform me what all dependencies needs to be bumbed on a module. It just bails out on the first duplicate package it finds. Maybe this was done for performance, but it would be really helpful if there were an option to override this behavior.
E.g. Let's say I have the following packages
packageA: uses moduleA.01
packageB: uses moduleA.02
packageC: uses moduleA.03
packageD: uses moduleA.04
Currently, it will warn
WARNING in moduleA
Multiple versions of moduleA found:
01 packageA
02 packageB
Then I go and update the packageA~moduleA to version 02. Now when I run the command again, it displays the following warning
WARNING in moduleA
Multiple versions of moduleA found:
02 packageB
02 packageC
And so on...
I need an option that will output all the packages where it's conflicting in a single command, something like this
WARNING in moduleA
Multiple versions of moduleA found:
01 packageA
02 packageB
03 packageC
04 packageD
This probably isn't an issue with the duplicate package checker plugin, but this warning is surfaced by it. Does anyone know of potential solutions to solve it?
<w> [webpack.cache.PackFileCacheStrategy/webpack.FileSystemInfo] Resolving 'color-name/package.json' in /path/to/project/node_modules/duplicate-package-checker-webpack-plugin/lib for build dependencies doesn't lead to expected result '/path/to/project/node_modules/color-name/package.json', but to '/path/to/project/node_modules/duplicate-package-checker-webpack-plugin/node_modules/color-name/package.json' instead. Resolving dependencies are ignored for this path.
<w> at unknown 4 color-name/package.json
<w> at file dependencies /path/to/project/node_modules/duplicate-package-checker-webpack-plugin/lib/index.js
<w> at file /path/to/project/node_modules/duplicate-package-checker-webpack-plugin/lib/index.js
<w> at file dependencies /path/to/project/sub/path/webpack.config.js
<w> at file /path/to/project/sub/path/webpack.config.js
<w> at resolve commonjs /path/to/project/sub/path/webpack.config.js
<w> [webpack.cache.PackFileCacheStrategy/webpack.FileSystemInfo] Resolving 'color-convert/package.json' in /path/to/project/node_modules/duplicate-package-checker-webpack-plugin/lib for build dependencies doesn't lead to expected result '/path/to/project/node_modules/color-convert/package.json', but to '/path/to/project/node_modules/duplicate-package-checker-webpack-plugin/node_modules/color-convert/package.json' instead. Resolving dependencies are ignored for this path.
<w> at unknown 4 color-convert/package.json
<w> at file dependencies /path/to/project/node_modules/duplicate-package-checker-webpack-plugin/lib/index.js
<w> at file /path/to/project/node_modules/duplicate-package-checker-webpack-plugin/lib/index.js
<w> at file dependencies /path/to/project/sub/path/webpack.config.js
<w> at file /path/to/project/sub/path/webpack.config.js
<w> at resolve commonjs /path/to/project/sub/path/webpack.config.js
@darrenscerri Is this project still actively maintained? We think it's super useful and would like to contribute a feature.
While most dependencies can be duplicated, we've found that there is a subset that, if duplicated, can be hard to debug and will throw cryptic errors at runtime. We'd like to add a blacklist of dependencies that should fail if duplicate dependencies are found.
Perhaps I'm just using this plugin wrong, but I can't seem to get any output even when I know my build contains multiple versions of the same module. For example, I made a quick test app that has the following dependency structure:
My App
βββ [email protected]
βββ Module A
β βββ [email protected]
βββ Module B
βββ [email protected]
When I run the app, this is the output:
As you can see, the modules and the app are all reporting that they are using different versions of lodash
. However, my build output doesn't show any warnings:
C:\Users\nfriend\code\test-app>gulp build
[15:01:53] Using gulpfile ~\code\test-app\gulpfile.js
[15:01:53] Starting 'build'...
[15:01:53] Starting 'clean:build'...
[15:01:53] Finished 'clean:build' after 17 ms
[15:01:53] Starting 'webpack'...
[15:01:53] Starting 'tslint'...
[15:01:53] Starting 'html-pages'...
[15:01:53] Starting 'assets'...
[15:01:53] Starting 'font-awesome'...
ts-loader: Using [email protected] and C:\Users\nfriend\code\test-app\tsconfig.json
[15:01:54] Finished 'html-pages' after 1.29 s
[15:02:00] Finished 'assets' after 6.92 s
[15:02:00] Finished 'font-awesome' after 6.92 s
[15:02:00] Finished 'tslint' after 6.93 s
[15:02:00] Finished 'webpack' after 7.13 s
[15:02:00] Finished 'build' after 7.15 s
C:\Users\nfriend\code\test-app>
Just to show that the app is correctly reporting the lodash
versions, if I add the following alias in my app's webpack.config
:
// force all "lodash" imports to use the app's version of lodash
'lodash': path.resolve(__dirname, 'node_modules/lodash')
the app displays this:
Just to be complete, here's my full webpack.config.js
:
const webpack = require('webpack');
const path = require('path');
const DuplicatePackageCheckerPlugin = require('duplicate-package-checker-webpack-plugin');
module.exports = {
entry: ['./src/entry.ts'],
output: {
filename: 'test-app.js'
},
devtool: 'source-map',
resolve: {
extensions: ['', '.ts', '.js', '.tsx', '.jsx'],
alias: {
angular: path.resolve(__dirname, 'node_modules/angular'),
// see http://stackoverflow.com/a/28989476/1063392
jquery: path.resolve(__dirname, 'node_modules/jquery/src/jquery'),
'bootstrap.css': path.resolve(__dirname, 'node_modules/bootstrap/dist/css/bootstrap.css'),
'AdminLTE.css': path.resolve(__dirname, 'node_modules/admin-lte/dist/css/AdminLTE.css'),
'skin-purple-light.css': path.resolve(__dirname, 'node_modules/admin-lte/dist/css/skins/skin-purple-light.css'),
'font-awesome.less': path.resolve(__dirname, 'node_modules/font-awesome/less/font-awesome.less'),
'lodash': path.resolve(__dirname, 'node_modules/lodash')
}
},
plugins: [
// see http://stackoverflow.com/a/28989476/1063392
new webpack.ProvidePlugin({
$: 'jquery',
jQuery: 'jquery',
'window.jQuery': 'jquery'
}),
new DuplicatePackageCheckerPlugin({
verbose: true
})
],
module: {
loaders: [
{
test: /\.ts$/,
loaders: ['ng-annotate', 'ts-loader']
},
{ test: /\.html$/, loader: 'html' },
{
test: /\.less$/,
loaders: [
'style-loader',
'css-loader?importLoaders=1&-url&-import',
'less-loader'
]
},
{
test: /\.css$/,
loaders: ['style-loader', 'css-loader?-url&-import']
}
]
},
htmlLoader: {
attrs: false,
minimize: false,
collapseWhitespace: true,
conservativeCollapse: true,
}
};
I use this webpack.config.js
in my gulp build, where I require()
the file and pass it to webpack-stream
to perform the actual webpack build.
Any ideas? Is there something else I need to do to make this plugin warn me when I use multiple versions of lodash
? Thanks!
It's possible for webpack to bundle multiple instances of a module even if the versions are the same. For example, here's a partial webpack stats output I saw in my project just now. Notice how the WorkboxError
module is included 6 times because the paths are different (even though the versions are the same):
[19] ./node_modules/workbox-precaching/node_modules/workbox-core/_private/WorkboxError.mjs 1.42 kB {0} [built]
[23] ./node_modules/workbox-strategies/node_modules/workbox-core/_private/WorkboxError.mjs 1.42 kB {0} [built]
[24] ./node_modules/workbox-broadcast-cache-update/node_modules/workbox-core/_private/WorkboxError.mjs 1.42 kB {0} [built]
[26] ./node_modules/workbox-cache-expiration/node_modules/workbox-core/_private/WorkboxError.mjs 1.42 kB {0} [built]
[28] ./node_modules/workbox-background-sync/node_modules/workbox-core/_private/WorkboxError.mjs 1.42 kB {0} [built]
[31] ./node_modules/workbox-routing/node_modules/workbox-core/_private/WorkboxError.mjs 1.42 kB {0} [built]
In the master branch, the package.json version is still 2.1.0
whereas on npm the latest version is 3.0.0
.
Master is out of date?
Would it be possible to show more information about the source of the problem?
Especially
I think these information would be useful to decide how to solve the problems.
Hi! First of all thank you for this great plugin, it works very well.
I think it should be extended to emit a warning even if one ore more packages have the same version.
In fact in my project i was including jQuery, with the same version, multiple times but i never noticed the problem untill now.
What do you think about this?
Thank you very much.
We have a package that contains loader and runtime. Therefore we can run into following confusing error which I hope you could check for.
We have something like this in webpack config in our host application.
modules: {rules: [
{test: /some-regex/,
use: 'our-package/loader'} // version A
...otherRules
]}
And in some library
import 'our-package/runtime'; // version B
And if runtime B
is not compatible with loader A
we are in trouble.
Could you please check for such situations?
A declarative, efficient, and flexible JavaScript library for building user interfaces.
π Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. πππ
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google β€οΈ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.