gp-designer 1.0.5

package/README.md

@@ -0,0 +1,83 @@
+# GP 网页设计器
+
+
+---
+
+## 1.百度地图显示
+
+```ts
+yarn add gp-designer
+import { GpBaiduMap } from "gp-designer";
+import 'gp-designer/dist/style.css';
+```
+
+![预览](./docs/images/GpBaiduMap.png)
+
+```ts
+<GpBaiduMap class="w-[360px]" :lng="lng" :lat="lat" :title="title" />
+
+<h2>1.百度地图显示组件</h2>
+<h3>a.单个标记点</h3>
+<button class="bg-blue-200" @click="onChanageLngLat">修改经纬度</button>
+<GpBaiduMap class="w-[360px]" :lng="lng" :lat="lat" :title="title" />
+
+<h2 class="mt-8">b.多个标记点</h2>
+<button class="bg-blue-200" @click="items = items2">修改经纬度</button>
+<GpBaiduMap :zoom="13" class="w-[360px]" :items="items" />
+
+<h2 class="mt-8">c.不显示未选中标记点文字，自定义 zoom</h2>
+<button class="bg-blue-200" @click="onChangeCenter">切换中心点</button>
+<GpBaiduMap :zoom="12" class="w-[360px]" :items="items" :no-select-show-text="false" />
+```
+
+## SSR 项目中使用
+
+> 注意配置 nuxt.config.ts
+
+```ts
+export default defineNuxtConfig({
+  // ...
+  build: {
+    transpile: ["gp-designer"],
+  },
+  vite: {
+    optimizeDeps: {
+      include: ["gp-designer"],
+    },
+  },
+  //...
+});
+```
+
+## 发布 npm 包
+
+```ts
+npm run push
+```
+
+## 项目说明
+
+Vue 3 + TypeScript + Vite + tailwindcss
+
+## 初始化项目
+
+```bash
+npm init vite@latest gp-city-selector --template vue-ts
+
+npm install -D tailwindcss postcss autoprefixer
+npx tailwindcss init
+```
+
+## Vue 3 + TypeScript + Vite
+
+npm init vite@latest gp-designer -- --template vue-ts
+cd my-vue3-lib
+npm install
+
+This template should help get you started developing with Vue 3 and TypeScript in Vite. The template uses Vue 3 `<script setup>` SFCs, check out the [script setup docs](https://v3.vuejs.org/api/sfc-script-setup.html#sfc-script-setup) to learn more.
+
+Learn more about the recommended Project Setup and IDE Support in the [Vue Docs TypeScript Guide](https://vuejs.org/guide/typescript/overview.html#project-setup).
+
+## 问题参考
+
+- 打包 ts 类型问题：https://blog.csdn.net/Wrysmile0308/article/details/134318030