warning in ./node_modules/peerjs/dist/peerjs.min.js Critical dependency: the request of a dependency is an expression #630

marcoippolito · 2020-03-02T18:58:15Z

My testing-app is compiling fine, except that I get this warning:
" Critical dependency: the request of a dependency is an expression"

(base) marco@pc01:~/webMatters/vueMatters/PeerJS-VueJS-Test$ npm run serve

> testproject@0.1.0 serve /home/marco/webMatters/vueMatters/PeerJS-VueJS-Test
> vue-cli-service serve

 INFO  Starting development server...
98% after emitting CopyPlugin

WARNING  Compiled with 1 warnings                                                                                                             
7:22:25 PM

warning  in ./node_modules/peerjs/dist/peerjs.min.js

Critical dependency: the request of a dependency is an expression


  App running at:
  - Local:   http://localhost:8080 
  - Network: http://ggc.world/

  Note that the development build is not optimized.
  To create a production build, run npm run build.

This is webpack.config.js :

{
    "mode": "development",
    "output": {
        "path": __dirname+'/static',
        "filename": "[name].[chunkhash:8].js"
    },
    "module": {
        "rules": [
            {
                "test": /\.vue$/,
                "exclude": /node_modules/,
                "use": "vue-loader"
            },
            {
                "test": /\.pem$/,
                "use": "file-loader"
            }
        ]
    },
    node: {
        __dirname: false,
        __filename: false
    },
    resolve: {
        extension: ['*', '.pem'],
    },
    devServer: {
        watchOptions: {
            aggregateTimeout: 300,
            poll: 1000
        },
        https: true,
        compress: true,
        public: 'ggc.world:8080'
    }
}

Any ideas about how to solve it?

The text was updated successfully, but these errors were encountered:

afrokick · 2020-03-04T07:40:30Z

Similar to #537

jextrevor · 2020-04-26T05:01:36Z

I'm also having this issue when using create-react-app with peerjs.

jgresham · 2020-06-23T21:58:33Z

I am having this issue as well with both peerjs v0.3.18 and latest version.

"react": "^16.13.1"
"react-scripts": "3.4.1"

loclv · 2020-07-13T12:04:02Z

I'm also having this issue when using:

{
    "peerjs": "^1.3.1",
    "webpack": "^4.43.0",
    "webpack-cli": "^3.3.12"
}

jextrevor · 2020-07-13T13:52:49Z

I'm also having this issue when using:

{
    "peerjs": "^1.3.1",
    "webpack": "^4.43.0",
    "webpack-cli": "^3.3.12"
}

I might be wrong, but I believe it's recommended to install webpack-cli globally and not as part of a project

loclv · 2020-07-14T07:02:41Z

@jextrevor

I might be wrong, but I believe it's recommended to install webpack-cli globally and not as part of a project

Thank you!

mbsyaswanth · 2020-08-05T14:34:43Z

I'm also having this issue when using create-react-app with peerjs.

I am getting the same warning in create-react-app .. Any updates?

for some reason, I am getting peer.call(userId, selfStream); as undefined.
please help me - the application is here. Create a room and try to join a person by copy pasting the meeting url in the address bar. Then you will see the error in console

joshverd · 2020-11-18T06:29:13Z

Still getting this issue over here.

Pigotz · 2020-11-23T18:49:55Z

I have this issue too 😔

See peers/peerjs#630

ElonLotfi · 2021-05-06T18:11:20Z

I have this issue

ntngoc96 · 2021-05-24T15:20:58Z

Me toooo.

preciousbetine · 2021-07-02T08:50:10Z

same here

preciousbetine · 2021-07-03T06:24:12Z

What I ended up doing was to remove the peerjs import from App.js and Include a script tag in my index.html file. For eslint, I added /* eslint-disable no-undef */ at the top of the file.

canotur · 2021-08-29T14:12:55Z

I have this issue too. Peerjs is not working with Angular? Does not PeerJs support Angular, or wont?
Is there any working Angular Project which using Peerjs?

deepakpixel · 2021-08-31T14:05:17Z

Is it still not fixed? This warning is so annoying.

WARNING:
./node_modules/peerjs/dist/peerjs.min.js
Critical dependency: the request of a dependency is an expression

I am using "peerjs": "^1.3.2" with ReactJS (create-react-app)

Pigotz · 2021-09-01T07:46:26Z

For anyone landing on this issue, I came up with a possible (not so clean) solution last night: have you ever heard of patch-package?

Keep in mind that the solution shown below works with peerjs@1.3.2 but I do not guarantee that the same patch is going to work with future versions of the package

Update 08/09/2021

Updated patch file to peerjs+1.3.2.patch.zip

TL;DR

Install patch-package inside devDependencies
Add a postinstall script inside your project's package.json with the following: patch-package
Download and unzip this patch peerjs+1.3.2.patch.zip and place it inside a patches folder inside the root of your project
Remove all the node_modules
Perform a clean npm i or yarn, depending on the package manager you use
Enjoy

Why

First of all: because that warning during the compilation of my project with Webpack is quite annoying.

Secondly: there is no real need for PeerJS to be compiled with Parcel, unless you're planning to build your project with Parcel as well but the majority of projects don't.

Also, I'm wondering why the authors of this library are not going to provide support for multiple compiled versions of the library.
I mean: it shouldn't be painful to support a normal TS compilation of the package and provide a bundled version as well, like they already do with Parcel.

This way, if a developer needs to use this package inside a bundled project, they would be free to import it as a normal ES5 library. They would still be free to import the minified bundled version as well.

How

I'm going to provide you the steps behind that patch, in order to let anyone better understand how it's been made.

I cded inside the node_modules/peerjs
I created a base tsconfig.json file with npx tsc --init
I changed some flags inside the default tsconfig.json configuration, not necessary though
I placed a lot of // @ts-ignore comments inside the .ts files in the lib folder, because I didn't want to change the actual source code but the compiler was complaining about some issues
I had to create an index.ts file inside the lib folder which export * from './all_the_other_files', check it inside the patch
I also had to create a peerjs.min.ts inside the lib folder which exports everything from the index one, the reason is that patch-package doesn't allow me to patch the package.json (in order to change the main property to something else) for some security reason, relatable
I removed al the files inside the dist folder
I prepared a build:ts script inside the package.json that simply runs npx tsc
I built the package with the previous script
I created the patch file by running npx patch-package peerjs inside the root of my project

siddharthmagadum16 · 2021-09-08T07:42:01Z

Hi, @Pigotz
I was trying your method to fix this. But after following those 5 steps, I face this error in browser, when I do npm start
Uncaught TypeError: peerjs__WEBPACK_IMPORTED_MODULE_2___default.a is not a constructor

I'm using react v17, peerjs v1.3.2, patch-package v6.4.7

Pigotz · 2021-09-08T07:53:52Z

@siddharthmagadum16 you're right, try this other patch: peerjs+1.3.2.patch.zip

siddharthmagadum16 · 2021-09-08T09:45:59Z

@Pigotz Yes, it works, thank you!

Hashen110 · 2021-10-17T15:30:42Z

hey @Pigotz

I got an error after removing node_modules and npm install

core-js@3.18.3 postinstall C:\Users\HP\Projects\twiists\twiists_frontend\node_modules\core-js
node -e "try{require('./postinstall')}catch(e){}"

Thank you for using core-js ( https://github.com/zloirock/core-js ) for polyfilling JavaScript standard library!

The project needs your help! Please consider supporting of core-js:

https://opencollective.com/core-js
https://patreon.com/zloirock
https://paypal.me/zloirock
bitcoin: bc1qlea7544qtsmj2rayg0lthvza9fau63ux0fstcz

Also, the author of core-js ( https://github.com/zloirock ) is looking for a good job -)

ejs@2.7.4 postinstall C:\Users\HP\Projects\twiists\twiists_frontend\node_modules\ejs
node ./postinstall.js

Thank you for installing EJS: built with the Jake JavaScript build tool (https://jakejs.com/)

twiists_frontend@0.0.1 postinstall C:\Users\HP\Projects\twiists\twiists_frontend
patch-package peerjs

patch-package 6.4.7
• Creating temporary folder
• Installing peerjs@1.3.2 with npm
• Diffing your files with clean files
⁉️ Not creating patch file for package 'peerjs'
⁉️ There don't appear to be any changes.
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! twiists_frontend@0.0.1 postinstall: patch-package peerjs
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the twiists_frontend@0.0.1 postinstall script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.

npm ERR! A complete log of this run can be found in:
npm ERR! C:\Users\HP\AppData\Roaming\npm-cache_logs\2021-10-17T15_16_50_122Z-debug.log

package.json:
{
"scripts": {
"lint": "eslint --ext .js,.vue ./",
"test": "echo "No test specified" && exit 0",
"postinstall": "patch-package peerjs"
},
"dependencies": {
"@quasar/extras": "^1.0.0",
"axios": "^0.21.1",
"core-js": "^3.6.5",
"peerjs": "^1.3.2",
"quasar": "^2.0.0",
"socket.io-client": "^4.3.2",
"socket.io-msgpack-parser": "^3.0.1"
},
"devDependencies": {
"@babel/eslint-parser": "^7.13.14",
"@quasar/app": "^3.0.0",
"eslint": "^7.14.0",
"eslint-config-standard": "^16.0.2",
"eslint-plugin-import": "^2.19.1",
"eslint-plugin-node": "^11.0.0",
"eslint-plugin-promise": "^5.1.0",
"eslint-plugin-vue": "^7.0.0",
"eslint-webpack-plugin": "^2.4.0",
"patch-package": "^6.4.7"
},
"browserslist": [
"last 30 Chrome versions",
"last 30 Firefox versions",
"last 12 Edge versions",
"last 21 Safari versions",
"last 24 Android versions",
"last 24 ChromeAndroid versions",
"last 24 FirefoxAndroid versions",
"last 30 iOS versions",
"last 15 Opera versions"
],
"engines": {
"node": ">= 12.22.1",
"npm": ">= 6.13.4",
"yarn": ">= 1.21.1"
}
}

Pigotz · 2021-10-18T07:40:50Z

Hey @Hashen110 👋

There seems to be an issue inside your postinstall script: it should only contain patch-package without peerjs.
So, in the end, your package.json should look like the following:

{
    "scripts": {
        "lint": "eslint --ext .js,.vue ./",
        "test": "echo \"No test specified\" && exit 0",
        "postinstall": "patch-package"
    },
    "dependencies": {
        "@quasar/extras": "^1.0.0",
        "axios": "^0.21.1",
        "core-js": "^3.6.5",
        "peerjs": "^1.3.2",
        "quasar": "^2.0.0",
        "socket.io-client": "^4.3.2",
        "socket.io-msgpack-parser": "^3.0.1"
    },
    "devDependencies": {
        "@babel/eslint-parser": "^7.13.14",
        "@quasar/app": "^3.0.0",
        "eslint": "^7.14.0",
        "eslint-config-standard": "^16.0.2",
        "eslint-plugin-import": "^2.19.1",
        "eslint-plugin-node": "^11.0.0",
        "eslint-plugin-promise": "^5.1.0",
        "eslint-plugin-vue": "^7.0.0",
        "eslint-webpack-plugin": "^2.4.0",
        "patch-package": "^6.4.7"
    },
    "browserslist": [
        "last 30 Chrome versions",
        "last 30 Firefox versions",
        "last 12 Edge versions",
        "last 21 Safari versions",
        "last 24 Android versions",
        "last 24 ChromeAndroid versions",
        "last 24 FirefoxAndroid versions",
        "last 30 iOS versions",
        "last 15 Opera versions"
    ],
    "engines": {
        "node": ">= 12.22.1",
        "npm": ">= 6.13.4",
        "yarn": ">= 1.21.1"
    }
}

The command patch-package peerjs is needed only if you've made some changes inside the node_modules folder and want them to persist across different installs, like I did 🙌

Hashen110 · 2021-10-18T14:56:51Z

@Pigotz It works :)

patch-package 6.4.7
Applying patches...
peerjs@1.3.2 ✔

Thank you for the quick response

- peers/peerjs#630 (comment) - 해당 링크 참고하여 경고 뜨는 부분을 수정하였습니다.

dyingsunlight · 2021-11-17T07:39:41Z

If you are using peerjs with typescript , import from source directly may resolve the issue

import { Peer } from 'peerjs/lib/peer'

const local = new Peer()

This work fine for me

apare · 2021-12-09T18:53:58Z

To fix this problem I added this to my webpack config:

module.exports = {
  module: {
    exprContextCritical: false
  }
}

This solve the warning but I'm not sure if exprContextCritical is important for you

yelban · 2021-12-30T09:00:03Z

To fix this problem I added this to my webpack config:
module.exports = {
  module: {
    exprContextCritical: false
  }
}
This solve the warning but I'm not sure if exprContextCritical is important for you

This work fine in Javascript

artola · 2022-01-27T09:25:58Z

exprContextCritical

@apare Here my use with a more restricted application:

      new webpack.ContextReplacementPlugin(/peerjs/, (context) => {
        context.dependencies[0].critical = false;

        return context;
      }),

afrokick · 2022-02-20T03:21:04Z

Should be fixed in peerjs@beta

question: > warn - ./node_modules/peerjs/dist/peerjs.min.js > Critical dependency: the request of a dependency is an expression link to: peers/peerjs#630 (comment)

Billy- mentioned this issue Feb 4, 2021

Critical Dependency #784

Closed

dalyIsaac added a commit to zoomutex/zoomutex that referenced this issue Apr 4, 2021

Handle peerjs critical dependency

aa3133a

See peers/peerjs#630

Pigotz mentioned this issue Sep 1, 2021

Webpack warning: Critical dependency: the request of a dependency is an expression #537

Closed

kihyuk-sung added a commit to boostcampwm-2021/web07-boostCam that referenced this issue Nov 11, 2021

Fix : Peerjs Critical Dependency 관련 수정

65d2ce6

- peers/peerjs#630 (comment) - 해당 링크 참고하여 경고 뜨는 부분을 수정하였습니다.

kihyuk-sung mentioned this issue Nov 11, 2021

빌드 시 경고 뜨는 부분 수정 boostcampwm-2021/web07-boostCam#56

Merged

afrokick closed this as completed Feb 20, 2022

afrokick added this to the 2.0.0 milestone Feb 20, 2022

domnantas mentioned this issue Mar 7, 2022

webpack5 hack causes issues with Vite openreplay/openreplay#214

Closed

powerfulyang added a commit to powerfulyang/powerfulyang.com that referenced this issue Apr 21, 2022

feat: peerjs

3cc24d9

question: > warn - ./node_modules/peerjs/dist/peerjs.min.js > Critical dependency: the request of a dependency is an expression link to: peers/peerjs#630 (comment)

powerfulyang mentioned this issue May 2, 2022

Todo at Client powerfulyang/powerfulyang.com#32

Closed

3 tasks

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

warning in ./node_modules/peerjs/dist/peerjs.min.js Critical dependency: the request of a dependency is an expression #630

warning in ./node_modules/peerjs/dist/peerjs.min.js Critical dependency: the request of a dependency is an expression #630

marcoippolito commented Mar 2, 2020

afrokick commented Mar 4, 2020

jextrevor commented Apr 26, 2020

jgresham commented Jun 23, 2020

loclv commented Jul 13, 2020

jextrevor commented Jul 13, 2020

loclv commented Jul 14, 2020

mbsyaswanth commented Aug 5, 2020

joshverd commented Nov 18, 2020

Pigotz commented Nov 23, 2020

ElonLotfi commented May 6, 2021

ntngoc96 commented May 24, 2021

preciousbetine commented Jul 2, 2021

preciousbetine commented Jul 3, 2021

canotur commented Aug 29, 2021

deepakpixel commented Aug 31, 2021

Pigotz commented Sep 1, 2021 •

edited

siddharthmagadum16 commented Sep 8, 2021

Pigotz commented Sep 8, 2021

siddharthmagadum16 commented Sep 8, 2021

Hashen110 commented Oct 17, 2021

Pigotz commented Oct 18, 2021 •

edited

Hashen110 commented Oct 18, 2021

dyingsunlight commented Nov 17, 2021

apare commented Dec 9, 2021

yelban commented Dec 30, 2021

artola commented Jan 27, 2022

afrokick commented Feb 20, 2022

warning in ./node_modules/peerjs/dist/peerjs.min.js Critical dependency: the request of a dependency is an expression #630

warning in ./node_modules/peerjs/dist/peerjs.min.js Critical dependency: the request of a dependency is an expression #630

Comments

marcoippolito commented Mar 2, 2020

afrokick commented Mar 4, 2020

jextrevor commented Apr 26, 2020

jgresham commented Jun 23, 2020

loclv commented Jul 13, 2020

jextrevor commented Jul 13, 2020

loclv commented Jul 14, 2020

mbsyaswanth commented Aug 5, 2020

joshverd commented Nov 18, 2020

Pigotz commented Nov 23, 2020

ElonLotfi commented May 6, 2021

ntngoc96 commented May 24, 2021

preciousbetine commented Jul 2, 2021

preciousbetine commented Jul 3, 2021

canotur commented Aug 29, 2021

deepakpixel commented Aug 31, 2021

Pigotz commented Sep 1, 2021 • edited

Update 08/09/2021

TL;DR

Why

How

siddharthmagadum16 commented Sep 8, 2021

Pigotz commented Sep 8, 2021

siddharthmagadum16 commented Sep 8, 2021

Hashen110 commented Oct 17, 2021

Pigotz commented Oct 18, 2021 • edited

Hashen110 commented Oct 18, 2021

dyingsunlight commented Nov 17, 2021

apare commented Dec 9, 2021

yelban commented Dec 30, 2021

artola commented Jan 27, 2022

afrokick commented Feb 20, 2022

Pigotz commented Sep 1, 2021 •

edited

Pigotz commented Oct 18, 2021 •

edited