Loading another script from markdown - issues

I have a simple markdown file which includes an external JS file like so:

loadJSFile.md

---
title: "Simple JS test"
---

<script type="text/javascript" src="./test.js"></script>

<button onClick="runTest()">run Test</button>

and the JS file sits in the same directory

test.js

function runTest () {
  console.log('run a test')
}

When I run gatsby develop and load the page, the test.js file is not loaded by the browser, meaning no request is even made, although I do see the script tag in the DOM. Therefore clicking the button results in an error.

Now if I run gatsby build and gatsby serve-build I see a 404 for the test.js file

Any ideas on how to approach this problem would be appreciated. Thank you!

gatsby --version 0.12.45

[Piyush3dB]

For reference, in issue #312 @stereoboost has posted https://react-styleguidist.js.org/ that is trying to address this. Example markdown file.

mdxc is another example how to approach this.

[jbolda]

@Piyush3dB were you able to figure it out? You can actually use js/jsx directly, and import a markdown file for your text. It becomes a bit of a pain if you want to lace react components within your text though. FYI, any file in /pages with dealt with. Js/x files will be used directly, and markdown will be transformed. Also anything prepended with an underscore will be used, but not put into the pages array. That means you can do _mycontent.md and require/import it into your jsx. It will be transformed to html markup so just dangerously set inner html to put it in your component.

The 1.0 branch is actively discussing how to write jsx in markdown though if you are interested.

I am going to close this as it’s old and the questions are answered, but feel free to ask more questions.