fix：预览引入builtin组件依赖，built组件样式文件注入js (#251)

packages/builtinComponent/package.json

@@ -16,10 +16,12 @@
     "directory": "packages/builtinComponent"
   },
   "scripts": {
-    "build": "vite build"
+    "build": "vite build",
+    "preview": "vite preview"
   },
   "dependencies": {
-    "@opentiny/vue": "~3.10.0"
+    "@opentiny/vue": "~3.10.0",
+    "vite-plugin-css-injected-by-js": "^3.3.1"
   },
   "devDependencies": {
     "@vitejs/plugin-vue": "^4.2.3",

packages/builtinComponent/vite.config.js

@@ -13,9 +13,10 @@ import { defineConfig } from 'vite'
 import path from 'path'
 import vue from '@vitejs/plugin-vue'
 import vueJsx from '@vitejs/plugin-vue-jsx'
+import vitePluginCssInjectedByJs from 'vite-plugin-css-injected-by-js'
 
 export default defineConfig({
-  plugins: [vue(), vueJsx()],
+  plugins: [vue(), vueJsx(), vitePluginCssInjectedByJs()],
   publicDir: false,
   build: {
     cssCodeSplit: false,
@@ -26,9 +27,6 @@ export default defineConfig({
       formats: ['es']
     },
     rollupOptions: {
-      output: {
-        banner: 'import "./style.css"'
-      },
       external: ['vue']
     }
   }

packages/design-core/src/preview/src/preview/importMap.js

@@ -40,6 +40,7 @@ importMap.imports = {
   'axios-mock-adapter': `${VITE_CDN_DOMAIN}/axios-mock-adapter@1.21.1/dist/axios-mock-adapter.js`,
   '@opentiny/tiny-engine-webcomponent-core': `${VITE_CDN_DOMAIN}/@opentiny/tiny-engine-webcomponent-core@1/dist/tiny-engine-webcomponent-core.es.js`,
   '@opentiny/tiny-engine-i18n-host': `${VITE_CDN_DOMAIN}/@opentiny/tiny-engine-i18n-host@1/dist/tiny-engine-i18n-host.es.js`,
+  '@opentiny/tiny-engine-builtin-component': `${VITE_CDN_DOMAIN}/@opentiny/tiny-engine-builtin-component@1/dist/index.js`,
   'vue-demi': `${VITE_CDN_DOMAIN}/vue-demi@0.13.11/lib/index.mjs`,
   pinia: `${VITE_CDN_DOMAIN}/pinia@2.0.22/dist/pinia.esm-browser.js`,
   ...tinyVue3Imports,