Bundling @argdown/markdown-it-plugin for Discourse

[DawnPaladin]

Hello! I'm trying to make a Discourse plugin so my team can embed Argdown maps in our Discourse forum.

Discourse's method of loading JavaScript files is not a great fit for loading NPM modules; you have to load each JS file individually, and there's no mechanism for them to require or import each other. I've asked the Discourse team what to do here and they recommend I bundle the Argdown library into a single file.

So I'm trying to use webpack to make a one-file version of @argdown/markdown-it-plugin and I'm not having much luck. Here's my webpack.config.js:

const NodePolyfillPlugin = require("node-polyfill-webpack-plugin");

module.exports = {
	mode: "production",
	plugins: [ new NodePolyfillPlugin() ],
	module: {
		rules: [
			{
				test: /\.ts$/,
				use: [
					{ loader: 'ts-loader' }
				]
			},
			{
				test: /\.css$/,
				use: [
					{ loader: 'style-loader' },
					{
						loader: 'css-loader',
						options: {
							modules: true
						}
					},
				]
			},
		]
	}
}

Here are the errors I'm getting:

ERROR in ./node_modules/@aduh95/viz.js/dist/render_sync.cjs 10:349-362
Module not found: Error: Can't resolve 'fs' in '/Users/dawn/Repositories/argdown/packages/argdown-markdown-it-plugin/node_modules/@aduh95/viz.js/dist'
@ ./node_modules/@argdown/core/dist/plugins/SyncDotToSvgExportPlugin.js 7:31-61
@ ./node_modules/@argdown/core/dist/argdown.js 14:35-80
@ ./dist/argdown-markdown-it-plugin.js 7:18-55

ERROR in ./node_modules/@argdown/core/dist-esm/ArgdownErrorMessageProvider.js 1:0-41
Module not found: Error: Can't resolve 'chevrotain' in '/Users/dawn/Repositories/argdown/packages/argdown-markdown-it-plugin/node_modules/@argdown/core/dist-esm'
@ ./node_modules/@argdown/core/dist-esm/parser.js 4:0-69 10:34-54
@ ./node_modules/@argdown/core/dist-esm/index.js 6:0-25 6:0-25
@ ./dist/argdown-markdown-it-plugin.js

That second error is duplicated 5 more times.

I really don't know bundling very well, but it would mean a lot to my team if we could zoom in and out of our nice crisp vector argument maps instead of just posting an enormous screenshot on our forum. If you have any advice about what to do here, I'd be supremely grateful. 😃

[christianvoigt]

Hi @DawnPaladin, have you solved your webpack problems? You could take a look at the argdown-vscode package, where I bundled up the extension and the preview with webpack (it was a configuration nightmare because of all the dependencies).

Integrating Argdown into Discourse is a great idea and I would love to hear about how it turns out. Let me know if you need any more help with this. I was occupied by other projects in the last months, but will at least do some maintenance work for Argdown in the coming weeks.

[DawnPaladin]

Thanks for your reply, @christianvoigt! I closed the issue because I am no longer working for the company that needed this done. If that ever changes, though, I'll definitely look at the argdown-vscode package. Thanks for your hard work on Argdown - I know it's a lot for one person to manage.