diff --git a/.esbuild/esbuild.cjs b/.esbuild/esbuild.cjs index affd08ef90..e38951bdbc 100644 --- a/.esbuild/esbuild.cjs +++ b/.esbuild/esbuild.cjs @@ -1,4 +1,4 @@ -const { esmBuild, iifeBuild } = require('./util.cjs'); +const { esmBuild, esmCoreBuild, iifeBuild } = require('./util.cjs'); const { build } = require('esbuild'); const handler = (e) => { @@ -12,10 +12,9 @@ build(iifeBuild({ minify: false, watch })).catch(handler); // mermaid.esm.mjs build(esmBuild({ minify: false, watch })).catch(handler); -// mermaid.core.js -build(iifeBuild({ minify: false, core: true })).catch(handler); - // mermaid.min.js build(esmBuild()).catch(handler); // mermaid.esm.min.mjs build(iifeBuild()).catch(handler); +// mermaid.core.mjs (node_modules unbundled) +build(esmCoreBuild()).catch(handler); diff --git a/.esbuild/util.cjs b/.esbuild/util.cjs index 6b462ff4e6..8c1c37eb2a 100644 --- a/.esbuild/util.cjs +++ b/.esbuild/util.cjs @@ -1,5 +1,6 @@ const { Generator } = require('jison'); const fs = require('fs'); +const { dependencies } = require('../package.json'); /** @typedef {import('esbuild').BuildOptions} Options */ @@ -27,8 +28,12 @@ const buildOptions = (override = {}) => { }; /** - * @param {Options} override - * @returns {Options} + * Build options for mermaid.esm.* build. + * + * For ESM browser use. + * + * @param {Options} override - Override options. + * @returns {Options} ESBuild build options. */ exports.esmBuild = (override = { minify: true }) => { return buildOptions({ @@ -39,17 +44,35 @@ exports.esmBuild = (override = { minify: true }) => { }; /** - * @param {Options & { core?: boolean }} override - * @returns {Options} + * Build options for mermaid.core.* build. + * + * This build does not bundle `./node_modules/`, as it is designed to be used + * with Webpack/ESBuild/Vite to use mermaid inside an app/website. + * + * @param {Options} override - Override options. + * @returns {Options} ESBuild build options. + */ +exports.esmCoreBuild = (override) => { + return buildOptions({ + format: 'esm', + outfile: `dist/mermaid.core.mjs`, + external: ['require', 'fs', 'path', ...Object.keys(dependencies)], + platform: 'neutral', + ...override, + }); +}; + +/** + * Build options for mermaid.js build. + * + * For IIFE browser use (where ESM is not yet supported). + * + * @param {Options} override - Override options. + * @returns {Options} ESBuild build options. */ -exports.iifeBuild = (override = { minify: true, core: false }) => { - const core = override.core; - if (core && override.minify) { - throw new Error('Cannot minify core build'); - } - delete override.core; +exports.iifeBuild = (override = { minify: true }) => { return buildOptions({ - outfile: `dist/mermaid${override.minify ? '.min' : core ? '.core' : ''}.js`, + outfile: `dist/mermaid${override.minify ? '.min' : ''}.js`, format: 'iife', ...override, }); @@ -61,7 +84,9 @@ const jisonPlugin = { build.onLoad({ filter: /\.jison$/ }, async (args) => { // Load the file from the file system const source = await fs.promises.readFile(args.path, 'utf8'); - const contents = new Generator(source, { 'token-stack': true }).generate(); + const contents = new Generator(source, { 'token-stack': true }).generate({ + moduleMain: '() => {}', // disable moduleMain (default one requires Node.JS modules) + }); return { contents, warnings: [] }; }); }, diff --git a/cypress/platform/bundle-test.js b/cypress/platform/bundle-test.js index 22f4fe93c1..b4ce798b20 100644 --- a/cypress/platform/bundle-test.js +++ b/cypress/platform/bundle-test.js @@ -1,4 +1,4 @@ -import mermaid from '../../dist/mermaid'; +import mermaid from '../../dist/mermaid.core.mjs'; let code = `flowchart LR Power_Supply --> Transmitter_A diff --git a/package.json b/package.json index e1709730e6..a94626597b 100644 --- a/package.json +++ b/package.json @@ -2,13 +2,13 @@ "name": "mermaid", "version": "9.1.6", "description": "Markdownish syntax for generating flowcharts, sequence diagrams, class diagrams, gantt charts and git graphs.", - "main": "dist/mermaid.min.js", - "module": "dist/mermaid.esm.min.mjs", + "main": "dist/mermaid.core.mjs", + "module": "dist/mermaid.core.mjs", "types": "dist/mermaid.d.ts", "exports": { ".": { "require": "./dist/mermaid.min.js", - "import": "./dist/mermaid.esm.min.mjs", + "import": "./dist/mermaid.core.mjs", "types": "./dist/mermaid.d.ts" }, "./*": "./*"