feat: setup demo build and deploy

Author: MichaelGitArt

demo/deploy.sh

@@ -0,0 +1,10 @@
+#!/usr/bin/env sh
+
+set -e
+yarn run build
+cd dist
+git init
+git add -A
+git commit -m 'deploy'
+git push -f https://github.com/MichaelGitArt/gitart-vue-dialog.git master:gh-pages
+cd -

demo/package.json

@@ -5,8 +5,10 @@
     "dev": "vite",
     "build": "vue-tsc --noEmit && vite build"
   },
+  "license": "MIT",
   "dependencies": {
-    "vue": "^3.0.5"
+    "gitart-vue-dialog": "^0.0.12",
+    "vue": "3.2.0-beta.7"
   },
   "devDependencies": {
     "@vitejs/plugin-vue": "^1.3.0",

demo/src/components/Dialogs/BaseDialog/BaseDialog.vue

@@ -17,7 +17,7 @@
 
 <script lang="ts">
 import { ref, defineComponent } from 'vue'
-import { GDialog } from 'plugin/index.js'
+import { GDialog } from 'plugin'
 
 import { useModelWrapper } from '@/composables/modelWrapper'
 

demo/src/components/Dialogs/StyledDialog/StyledDialog.vue

@@ -24,7 +24,7 @@
 
 <script lang="ts">
 import { defineComponent } from 'vue'
-import { GDialog } from 'plugin/index.js'
+import { GDialog } from 'plugin'
 
 import { useModelWrapper } from '@/composables/modelWrapper'
 

demo/src/scss/main.scss

@@ -1 +1 @@
-@import 'plugin/style.css'
+@import 'plugin-css'

demo/tsconfig.json

@@ -12,7 +12,8 @@
     "baseUrl": ".",
     "paths": {
       "@/*": ["./src/*"],
-      "plugin/*": ["../dist/*"],
+      "plugin": ["../dist/index"],
+      "plugin-css": ["../dist/style.css"]
     }
   },
   "include": ["src/**/*.ts", "src/**/*.d.ts", "src/**/*.tsx", "src/**/*.vue"]

demo/vite.config.ts

@@ -3,25 +3,41 @@ import { defineConfig } from 'vite'
 import vue from '@vitejs/plugin-vue'
 import WindiCSS from 'vite-plugin-windicss'
 
-export default ({ mode }: { mode: 'production'| 'development' }) => defineConfig({
-  base: mode === 'production'
-    ? '/gitart-vue-dialog/'
-    : '/',
+export default ({ mode }: { mode: 'production'| 'development' }) => {
+  const dialogPlugin = mode === 'development'
+    ? path.resolve(__dirname, '../dist/index.js')
+    : 'gitart-vue-dialog'
 
-  plugins: [
-    vue(),
-    WindiCSS(),
-  ],
-  server: {
-    fs: {
-      strict: false,
-      allow: ['../'],
+  const dialogPluginCss = mode === 'development'
+    ? path.resolve(__dirname, '../dist/style.css')
+    : 'gitart-vue-dialog/dist/style.css'
+
+  return defineConfig({
+    base: mode === 'production'
+      ? '/gitart-vue-dialog/'
+      : '/',
+
+    plugins: [
+      vue(),
+      WindiCSS(),
+    ],
+
+    server: {
+      fs: {
+        strict: false,
+        allow: [path.resolve(__dirname, '../')],
+      },
     },
-  },
-  resolve: {
-    alias: {
-      '@': path.resolve(__dirname, '/src'),
-      'plugin': path.resolve(__dirname, '../dist'),
+
+    resolve: {
+      alias: {
+        '@': path.resolve(__dirname, '/src'),
+        'plugin': dialogPlugin,
+        'plugin-css': dialogPluginCss,
+      },
+    },
+
+    build: {
+      sourcemap: true,
     },
-  },
-})
+  })}