jsPsych icon indicating copy to clipboard operation
jsPsych copied to clipboard

Automatically handling URLs in `/docs/demos` to make development easier

Open jodeleeuw opened this issue 2 years ago • 0 comments

The /docs/demos folder has many HTML files that serve as the interactive demos on the documentation site.

These import jspsych scripts from unpkg. Here's a typical example.

<script src="https://unpkg.com/[email protected]"></script>
<script src="https://unpkg.com/@jspsych/[email protected]"></script>
<script src="https://unpkg.com/@jspsych/[email protected]"></script>
<script src="https://unpkg.com/@jspsych/[email protected]"></script>
<link rel="stylesheet" href="https://unpkg.com/[email protected]/css/jspsych.css" />

When developing locally, if you are working with modified, unpublished code then you have to change these references to local build files. Here's what this looks like for one example I'm working on.

<head>
    <script src="docs-demo-timeline.js"></script>
    <script src="https://unpkg.com/[email protected]"></script>
    <!-- <script src="https://unpkg.com/@jspsych/[email protected]"></script> -->
    <script src="../../packages/plugin-html-button-response/dist/index.browser.js"></script>
    <!-- <link rel="stylesheet" href="https://unpkg.com/[email protected]/css/jspsych.css" /> -->
    <link rel="stylesheet" href="../../packages/jspsych/css/jspsych.css" />
    <link rel="stylesheet" href="docs-demo.css" type="text/css">
</head>

It would be nice to allow these to be local paths in the repo, but then change them to the relevant unpkg URL when we build the documentation. Then the examples would be easier to build and would serve as local manual test files for development.

jodeleeuw avatar Oct 19 '23 15:10 jodeleeuw