Allow webpack config customizations

[jmuchovej]

Maybe this is out of the scope of jspsych-builder (and maybe I'm among the few that prefer markdown to raw HTML), but... I think having the ability to leverage mdx, since we can use React would be awesome. 😅

I'm not too sure if this starts approaching the maintenance/usage level of an SSG (e.g., next.js), but having the ability to specify instructions/whatnot in mdx would certainly be preferable to writing HTML as strings or at all (imo).

(If this does increase the management load to something akin to an SSG, feel free to close this. 😅)

Maybe this makes more sense as a "open up projects to customizing Webpack through a top-level webpack.config.js" or equivalent? (I wager this would minimize workload on your end while enabling users to "do what they want".)

[bjoluc]

and maybe I'm among the few that prefer markdown to raw HTML

At least you're not alone; I've been using Marked for this. Didn't know mdx yet, looks interesting!

Maybe this makes more sense as a "open up projects to customizing Webpack through a top-level webpack.config.js" or equivalent? (I wager this would minimize workload on your end while enabling users to "do what they want".)

Right, that would be quite social :smile: I think we can default-export a function from webpack.config.js that takes the predefined webpack config and returns a modified version of that. Which would need some words of caution, since the config may change in a then breaking way even in minor releases... WDYT?

[jmuchovej]

The approach seems reasonable, too. Maybe this also gives a way to resolve #19, too?

Also, I included MDX support on a local copy of jspsych-builder and it seems to work so far. I may submit a ReactPlugin to demonstrate how to integrate React components into jsPsych.

Definitely agreed on words of caution. Also seems reasonable to throw in a "minimal/no support" for custom webpack.config.js since that could balloon time commitment. 😅

[bjoluc]

Maybe this also gives a way to resolve #19, too?

Not too sure if it does, since the port is only a config option of the dev server, not the compiler (AFAIK). Anyway, I'd say the port use case is frequent enough to be supported stably.

[jmuchovej]

👋 so... I managed to get this working, but it required setting jspsych-builder to be a commonjs module.

# package.json
- "type": "module",

# tsconfig.json
- "module": "esnext",
+ "module": "commonjs",

Seemingly, nothing changes. (I'm able to start the dev server, use MDX, and the like.)

I'll open a PR shortly with these changes so you can take a look. 🙂

[github-actions[bot]]

:tada: This issue has been resolved in version 4.2.0 :tada:

The release is available on:

• npm package (@latest dist-tag)
• GitHub release

Your semantic-release bot :package::rocket: