diff --git a/documentation/md/getting-started.md b/documentation/md/getting-started.md index eb76b960bc..e7a60b51fd 100644 --- a/documentation/md/getting-started.md +++ b/documentation/md/getting-started.md @@ -33,7 +33,7 @@ The available files are available under [`cytoscape/dist/`](https://github.com/c | `cytoscape.umd.js` | no | [UMD] | all | Useful for debugging on small pages, supplementary material for an academic paper for example. | | `cytoscape.esm.min.js` | yes | [ESM] (ECMAScript, uses `import` / `export`) | all | Serves the same purpose as the above, but it can be imported as an [ES6] module without the need for a bundler. | | `cytoscape.cjs.js` | no | [CJS] (CommonJS, used by [Node.js]) | none | Intended to be consumed automatically by [Node.js] or a bundler like [Webpack] via `require('cytoscape')`. | -| `cytoscape.esm.js` | no | [ESM] (`import` / `export`) | none | Intended to be consumed automatically by [Node.js] or a bundler like [Webpack] via `import cytoscape from 'cytoscape'`. | +| `cytoscape.esm.js` | no | [ESM] (`import` / `export`) | all | Intended to be consumed automatically by [Node.js] or a bundler like [Webpack] via `import cytoscape from 'cytoscape'`. | Note that Cytoscape.js uses the dimensions of your HTML DOM element container for layouts and rendering at initialisation. Thus, it is very important to place your CSS stylesheets in the `` before any Cytoscape.js-related code. Otherwise, dimensions may be sporadically reported incorrectly, resulting in undesired behaviour. diff --git a/package.json b/package.json index 4286163e9f..12b30019a9 100644 --- a/package.json +++ b/package.json @@ -31,6 +31,13 @@ "node": ">=0.10" }, "main": "dist/cytoscape.cjs.js", + "module": "dist/cytoscape.esm.js", + "exports": { + ".": { + "import": "./dist/cytoscape.esm.js", + "require": "./dist/cytoscape.cjs.js" + } + }, "unpkg": "dist/cytoscape.min.js", "jsdelivr": "dist/cytoscape.min.js", "scripts": { diff --git a/rollup.config.js b/rollup.config.js index 41ce3284f4..2dcf90447e 100644 --- a/rollup.config.js +++ b/rollup.config.js @@ -105,9 +105,9 @@ const configs = [ { input, output: { file: 'build/cytoscape.esm.js', format: 'es' }, - external: isExternal, plugins: [ nodeResolve(), + commonjs({ include: '**/node_modules/**' }), BABEL ? babel(getBabelOptions()) : {}, replace(envVariables), license(licenseHeaderOptions)