Use module script

diff --git a/index.html b/index.html
index 0d911b45e5dc9ab252dbc56a073982690cfa03b8..16c6770b831a4d70c8e157874cf4bf64e8f580cb 100644 (file)
--- a/index.html
+++ b/index.html
@@ -6,7 +6,7 @@
   <meta name="viewport" content="width=device-width, initial-scale=1">
   <meta name="description" content="Ardis Lu's personal blog.">
   <link rel="icon" href="/favicon.ico">
-  <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.2.0/styles/default.min.css">
+  <link rel="stylesheet" href="https://cdn.jsdelivr.net/gh/highlightjs/cdn-release@11.4.0/build/styles/default.min.css">
   <link rel="stylesheet" href="/style.css">
   <link rel="stylesheet" href="/print.css" media="print">
   <title>ardislu.dev</title>
@@ -54,10 +54,7 @@
     <main></main>
   </template>
 
-  <script src="https://cdnjs.cloudflare.com/ajax/libs/marked/3.0.4/marked.min.js"></script>
-  <script src="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.2.0/highlight.min.js"></script>
-  <script src="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.2.0/languages/powershell.min.js"></script>
-  <script src="/script.js"></script>
+  <script type="module" src="/script.js"></script>
 </body>
 
 </html>
\ No newline at end of file

diff --git a/script.js b/script.js
index a536a2ca931415e52e7549d950034696ab5a275d..fce6fe9bf706c4c90010de686afaf1e373de4302 100644 (file)
--- a/script.js
+++ b/script.js
@@ -1,3 +1,8 @@
+import { marked } from 'https://cdn.jsdelivr.net/npm/marked@4.0.12/lib/marked.esm.min.js';
+import hljs from 'https://cdn.jsdelivr.net/gh/highlightjs/cdn-release@11.4.0/build/es/highlight.min.js';
+import powershell from 'https://cdn.jsdelivr.net/gh/highlightjs/cdn-release@11.4.0/build/es/languages/powershell.min.js';
+hljs.registerLanguage('powershell', powershell);
+
 if ('serviceWorker' in navigator) {
   navigator.serviceWorker.register('/sw.js');
 }