build: offer sourcemap & global variable

Author: cloydlau

src/Component.ts

@@ -17,9 +17,9 @@ import { globalAttrs, globalProps } from './index'
 
 export type Mode = 'tree' | 'text'
 
+const name = 'JsonEditorVue'
 const modelValueProp = isVue3 ? 'modelValue' : 'value'
 const updateModelValue = isVue3 ? 'update:modelValue' : 'input'
-
 const boolAttrs = [
   'mainMenuBar',
   'navigationBar',
@@ -30,7 +30,7 @@ const boolAttrs = [
 ]
 
 export default defineComponent({
-  name: 'JsonEditorVue',
+  name,
   props: {
     [modelValueProp]: {},
     mode: {
@@ -166,3 +166,5 @@ export default defineComponent({
     return () => h('div', { ref: 'jsonEditorRef' })
   },
 })
+
+export { name }

vite.config.ts

@@ -1,6 +1,7 @@
 import type { ConfigEnv, UserConfigExport } from 'vite'
 import dts from 'vite-plugin-dts'
 import { name } from './package.json'
+import { name as globalVariableName } from './src/Component'
 
 // https://vitejs.dev/config/
 export default ({ command }: ConfigEnv): UserConfigExport => {
@@ -10,18 +11,16 @@ export default ({ command }: ConfigEnv): UserConfigExport => {
         name,
         entry: 'src/index.ts',
       },
+      sourcemap: true,
       rollupOptions: {
         external: [
           'vanilla-jsoneditor',
           'vue',
           'vue-demi',
         ],
         output: {
-          // 在 UMD 构建模式下为这些外部化的依赖提供一个全局变量
           globals: {
-            'vanilla-jsoneditor': 'JSONEditor',
-            'vue': 'Vue',
-            'vue-demi': 'VueDemi',
+            [name]: globalVariableName,
           },
         },
       },