`require` or `import` CommonJS node modules using rollup

Question

I am unsure whether I am supposed to use the require version or the import version. It doesn't state that in the documentation and I found a statement in a Github issue that

Mixing import and require is definitely discouraged. The only way for Rollup to handle require statements is with rollup-plugin-commonjs, but that plugin will skip any files with import or export statements.

which could be interpreted as: "You need to still use require otherwise the common-js plugin will ignore your file and things will not work." or as "always use import everything else would constitute mixing". So that really confused me.

Context

I am trying to import a CommonJS library (Citation-js) into a javascript module (really typescript but I hope this is not relevant here). Now the documentation of common-js tells me to do

const Cite = require('common-js');

which tells me that it is a commonjs library (right?). Therefore I added

import commonjs from "rollup-plugin-commonjs";
import { nodeResolve } from "@rollup/plugin-node-resolve";

to my rollup config and put plugins: [commonjs(), typescript(), nodeResolve()] into the configuration.

Now vscode stops underlining everything and building the website with rollup works again. But the compiled javascript simply states require('common-js') and my browser complains that require is undefined.

Uncaught ReferenceError: require is not defined

So I tried

import Cite from 'common-js';

instead. But that resulted in the rollup build failing with

[!] Error: Unexpected token (Note that you need @rollup/plugin-json to import JSON files)
node_modules/@citation-js/core/package.json (2:8)
1: {
2:   "name": "@citation-js/core",
           ^

Now I could of course install that plugin. But I am not sure that is right, since the whole point of a tool like rollup should be that dependencies of dependencies should be resolved automatically right?

I have also tried

• Can't import npm modules in commonjs with rollup : "require is not defined"

• This seemed like it would fix my problem: Using Older Require Module With Rollup

  But:

  • the rollup-plugin-node-builtins is apparently not maintained (npm protested with security vulnerabilities and I found this: https://github.com/rollup/rollup/issues/2881). EDIT: There is a new package rollup-plugin-polyfill-node replacing that I guess.
  • resolve is no longer a member of @rollup/plugin-node-resolve so I assume that this has become nodeResolve which I am already using...

• EDIT: installing @rollup/plugin-json actually lets me build the site again (with a bunch of warnings)

  • (!) Missing shims for Node.js built-ins (which is not fixed by the rollup-plugin-polyfill-node above)
  • (!) Missing global variable names
  • (!) Circular dependencies
  • (!) Unresolved dependencies

  not sure what to do about these warnings