Use React via CDN

package-lock.json

@@ -1,119 +0,0 @@
-{
-  "name": "sci-script-tag",
-  "lockfileVersion": 2,
-  "requires": true,
-  "packages": {
-    "": {
-      "dependencies": {
-        "react": "17.0.1",
-        "react-dom": "17.0.1"
-      }
-    },
-    "node_modules/js-tokens": {
-      "version": "4.0.0",
-      "resolved": "https://registry.npmjs.org/js-tokens/-/js-tokens-4.0.0.tgz",
-      "integrity": "sha512-RdJUflcE3cUzKiMqQgsCu06FPu9UdIJO0beYbPhHN4k6apgJtifcoCtT9bcxOpYBtpD2kCM6Sbzg4CausW/PKQ=="
-    },
-    "node_modules/loose-envify": {
-      "version": "1.4.0",
-      "resolved": "https://registry.npmjs.org/loose-envify/-/loose-envify-1.4.0.tgz",
-      "integrity": "sha512-lyuxPGr/Wfhrlem2CL/UcnUc1zcqKAImBDzukY7Y5F/yQiNdko6+fRLevlw1HgMySw7f611UIY408EtxRSoK3Q==",
-      "dependencies": {
-        "js-tokens": "^3.0.0 || ^4.0.0"
-      },
-      "bin": {
-        "loose-envify": "cli.js"
-      }
-    },
-    "node_modules/object-assign": {
-      "version": "4.1.1",
-      "resolved": "https://registry.npmjs.org/object-assign/-/object-assign-4.1.1.tgz",
-      "integrity": "sha1-IQmtx5ZYh8/AXLvUQsrIv7s2CGM=",
-      "engines": {
-        "node": ">=0.10.0"
-      }
-    },
-    "node_modules/react": {
-      "version": "17.0.1",
-      "resolved": "https://registry.npmjs.org/react/-/react-17.0.1.tgz",
-      "integrity": "sha512-lG9c9UuMHdcAexXtigOZLX8exLWkW0Ku29qPRU8uhF2R9BN96dLCt0psvzPLlHc5OWkgymP3qwTRgbnw5BKx3w==",
-      "dependencies": {
-        "loose-envify": "^1.1.0",
-        "object-assign": "^4.1.1"
-      },
-      "engines": {
-        "node": ">=0.10.0"
-      }
-    },
-    "node_modules/react-dom": {
-      "version": "17.0.1",
-      "resolved": "https://registry.npmjs.org/react-dom/-/react-dom-17.0.1.tgz",
-      "integrity": "sha512-6eV150oJZ9U2t9svnsspTMrWNyHc6chX0KzDeAOXftRa8bNeOKTTfCJ7KorIwenkHd2xqVTBTCZd79yk/lx/Ug==",
-      "dependencies": {
-        "loose-envify": "^1.1.0",
-        "object-assign": "^4.1.1",
-        "scheduler": "^0.20.1"
-      },
-      "peerDependencies": {
-        "react": "17.0.1"
-      }
-    },
-    "node_modules/scheduler": {
-      "version": "0.20.2",
-      "resolved": "https://registry.npmjs.org/scheduler/-/scheduler-0.20.2.tgz",
-      "integrity": "sha512-2eWfGgAqqWFGqtdMmcL5zCMK1U8KlXv8SQFGglL3CEtd0aDVDWgeF/YoCmvln55m5zSk3J/20hTaSBeSObsQDQ==",
-      "dependencies": {
-        "loose-envify": "^1.1.0",
-        "object-assign": "^4.1.1"
-      }
-    }
-  },
-  "dependencies": {
-    "js-tokens": {
-      "version": "4.0.0",
-      "resolved": "https://registry.npmjs.org/js-tokens/-/js-tokens-4.0.0.tgz",
-      "integrity": "sha512-RdJUflcE3cUzKiMqQgsCu06FPu9UdIJO0beYbPhHN4k6apgJtifcoCtT9bcxOpYBtpD2kCM6Sbzg4CausW/PKQ=="
-    },
-    "loose-envify": {
-      "version": "1.4.0",
-      "resolved": "https://registry.npmjs.org/loose-envify/-/loose-envify-1.4.0.tgz",
-      "integrity": "sha512-lyuxPGr/Wfhrlem2CL/UcnUc1zcqKAImBDzukY7Y5F/yQiNdko6+fRLevlw1HgMySw7f611UIY408EtxRSoK3Q==",
-      "requires": {
-        "js-tokens": "^3.0.0 || ^4.0.0"
-      }
-    },
-    "object-assign": {
-      "version": "4.1.1",
-      "resolved": "https://registry.npmjs.org/object-assign/-/object-assign-4.1.1.tgz",
-      "integrity": "sha1-IQmtx5ZYh8/AXLvUQsrIv7s2CGM="
-    },
-    "react": {
-      "version": "17.0.1",
-      "resolved": "https://registry.npmjs.org/react/-/react-17.0.1.tgz",
-      "integrity": "sha512-lG9c9UuMHdcAexXtigOZLX8exLWkW0Ku29qPRU8uhF2R9BN96dLCt0psvzPLlHc5OWkgymP3qwTRgbnw5BKx3w==",
-      "requires": {
-        "loose-envify": "^1.1.0",
-        "object-assign": "^4.1.1"
-      }
-    },
-    "react-dom": {
-      "version": "17.0.1",
-      "resolved": "https://registry.npmjs.org/react-dom/-/react-dom-17.0.1.tgz",
-      "integrity": "sha512-6eV150oJZ9U2t9svnsspTMrWNyHc6chX0KzDeAOXftRa8bNeOKTTfCJ7KorIwenkHd2xqVTBTCZd79yk/lx/Ug==",
-      "requires": {
-        "loose-envify": "^1.1.0",
-        "object-assign": "^4.1.1",
-        "scheduler": "^0.20.1"
-      }
-    },
-    "scheduler": {
-      "version": "0.20.2",
-      "resolved": "https://registry.npmjs.org/scheduler/-/scheduler-0.20.2.tgz",
-      "integrity": "sha512-2eWfGgAqqWFGqtdMmcL5zCMK1U8KlXv8SQFGglL3CEtd0aDVDWgeF/YoCmvln55m5zSk3J/20hTaSBeSObsQDQ==",
-      "requires": {
-        "loose-envify": "^1.1.0",
-        "object-assign": "^4.1.1"
-      }
-    }
-  }
-}

package.json

@@ -1,6 +0,0 @@
-{
-  "dependencies": {
-    "react": "17.0.1",
-    "react-dom": "17.0.1"
-  }
-}

resources/public/index.html

@@ -3,6 +3,8 @@
   <head>
     <link rel="stylesheet" href="css/style.css">
     <script src="js/sci-script-tag.js" type="application/javascript"></script>
+    <script crossorigin src="https://unpkg.com/react@17/umd/react.production.min.js"></script>
+    <script crossorigin src="https://unpkg.com/react-dom@17/umd/react-dom.production.min.js"></script>
     <script src="js/sci-script-tag-plugin-reagent.js" type="application/javascript"></script>
     <script type="application/x-sci">
       (defn my-alert []
@@ -89,10 +91,14 @@
     <h2><a href="#reagent">Reagent plugin</a></h2>
 
     To enable <a href="https://github.com/reagent-project/reagent">reagent</a>,
-    in addition to <tt>sci-script-tag.js</tt>, you need to include <tt>sci-script-tag-plugin-reagent.js</tt>.
+    in addition to <tt>sci-script-tag.js</tt>, you need to include React
+    and <tt>sci-script-tag-plugin-reagent.js</tt>:
 
     <pre><code class="html">
+&lt;script crossorigin src=&quot;https://unpkg.com/react@17/umd/react.production.min.js&quot;&gt;&lt;/script&gt;
+&lt;script crossorigin src=&quot;https://unpkg.com/react-dom@17/umd/react-dom.production.min.js&quot;&gt;&lt;/script&gt;
 &lt;script src=&quot;https://borkdude.github.io/sci-script-tag/js/sci-script-tag-plugin-reagent.js&quot; type=&quot;application/javascript&quot;&gt;&lt;/script&gt;
+
 &lt;script type=&quot;application/x-sci&quot;&gt;
   (require '[reagent.core :as r]
            '[reagent.dom :as rdom])

resources/public/tictactoe.html

@@ -3,6 +3,9 @@
   <head>
     <link rel="stylesheet" href="css/style.css">
     <script src="js/sci-script-tag.js" type="application/javascript"></script>
+
+    <script crossorigin src="https://unpkg.com/react@17/umd/react.production.min.js"></script>
+    <script crossorigin src="https://unpkg.com/react-dom@17/umd/react-dom.production.min.js"></script>
     <script src="js/sci-script-tag-plugin-reagent.js" type="application/javascript"></script>
 
     <script type="application/x-sci" src="cljs/tictactoe.cljs"></script>
@@ -21,7 +24,11 @@
     <p>The following source was loaded and interpreted
  from <a href="cljs/tictactoe.cljs"><tt>cljs/tictactoe.cljs</tt></a> using the
  script tag:
-      <pre><code class="html">&lt;script type=&quot;application/x-sci&quot; src=&quot;cljs/tictactoe.cljs&quot;&gt;&lt;/script&gt;</code></pre>
+      <pre><code class="html">
+&lt;script type=&quot;application/x-sci&quot; src=&quot;cljs/tictactoe.cljs&quot;&gt;&lt;/script&gt;
+&lt;script crossorigin src=&quot;https://unpkg.com/react@17/umd/react.production.min.js&quot;&gt;&lt;/script&gt;
+&lt;script crossorigin src=&quot;https://unpkg.com/react-dom@17/umd/react-dom.production.min.js&quot;&gt;&lt;/script&gt;
+</code></pre>
     </p>
     <pre><code class="language-clojure" id="cljs"></code></pre>
     <script type="application/x-sci">

shadow-cljs.edn

@@ -7,6 +7,11 @@
  :builds
  {:main
   {:target     :browser
+   :js-options
+   {:resolve {"react" {:target :global
+                       :global "React"}
+              "react-dom" {:target :global
+                           :global "ReactDOM"}}}
    :modules
    {:sci-script-tag {:entries [sci.script-tag]}
     :sci-script-tag-plugin-reagent {:entries [sci.script-tag.plugin-reagent]