chore: add readme & vite lib config

Quozul · Jun 15, 2024 · d3cf40d · d3cf40d
1 parent a5788ca
commit d3cf40d
Show file tree

Hide file tree

Showing 3 changed files with 21 additions and 2 deletions.
diff --git a/README.md b/README.md
@@ -0,0 +1,11 @@
+# canvas-image
+A canvas to view image, zoom and pan.
+
+## Usage
+
+### Vanilla HTML
+```html
+<canvas-image src="https://quozul.github.io/canvas-image/image-landscape.jpg"></canvas-image>
+<script src="https://quozul.github.io/canvas-image/canvas-image.js"></script>
+```
+> :warning: GitHub Pages is not a CDN, so you should download the `canvas-image.js` file locally!
diff --git a/index.html → public/index.html b/index.html → public/index.html
@@ -4,10 +4,10 @@
     <meta charset="UTF-8" />
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
     <title>Canvas image</title>
-    <link href="/style.css" rel="stylesheet" type="text/css">
+    <link href="/canvas-image/style.css" rel="stylesheet" type="text/css">
   </head>
   <body>
     <canvas-image src="/canvas-image/image-landscape.jpg"></canvas-image>
-    <script type="module" src="/src/main.ts"></script>
+    <script type="module" src="/canvas-image/canvas-image.js"></script>
   </body>
 </html>
diff --git a/vite.config.ts b/vite.config.ts
@@ -1,6 +1,14 @@
 import { defineConfig } from "vite";
+import { resolve } from "node:path";
 
 // https://vitejs.dev/config/
 export default defineConfig({
   base: "/canvas-image/",
+  build: {
+    lib: {
+      entry: resolve(__dirname, "src/main.ts"),
+      name: "canvas-image",
+      fileName: "canvas-image",
+    },
+  },
 });