Global CSS cannot be imported from within node_modules

[sgrove]

Describe the bug In next.js, import * as YMonaco from "y-monaco"; will (eventually) cause an error:

./node_modules/monaco-editor/esm/vs/base/browser/ui/actionbar/actionbar.css
Global CSS cannot be imported from within node_modules.
Read more: https://err.sh/next.js/css-npm
Location: node_modules/monaco-editor/esm/vs/base/browser/ui/actionbar/actionViewItems.js

To Reproduce Steps to reproduce the behavior:

1. Create/clone a bog-standard next.js app
2. Add npm i y-monaco
3. Copy/paste the example code into pages/index.js
4. See error

Expected behavior Some way of potentially delaying the import of monaco may help with the issue

Environment Information

• next.js ~10

  "y-monaco": "^0.1.2",
  "y-webrtc": "^10.1.8",
  "yjs": "^13.5.5"

Happy to help track this down, I know dealing with Monaco can be challenging in certain environments (though it is quite amazing once it's up and running!).

[dmonad]

Hi @sgrove,

that doesn't seem to be related to Yjs. It seems to be a problem with the interaction of Monaco with next.js.