✨ feat: 更改export 值

README.md

@@ -9,105 +9,119 @@ Vue 图片预览组件
 
 ## 安装
 
-```
+```bash
 npm i fox-preview-image
 # or
 yarn add fox-preview-image
+# or
+pnpm add fox-preview-image
 ```
 
 ## 引入组件
 
-```
-import foxPreviewImage from "fox-preview-image";
-import "fox-preview-image/lib/style.css";
+```js
+import foxPreviewImage from 'fox-preview-image'
+import 'fox-preview-image/lib/style.css'
 Vue.use(foxPreviewImage)
 ```
 
 ## 基础使用
 
-```
+```html
 <fox-preview-image v-model="visiable" :src="imageSrc" z-index="9000"></fox-preview-image>
 ```
 
 ## 演示地址
 
-[GITHUB](https://guojikun.github.io/preview-image/)
-
-[码云](https://guojikun_admin.gitee.io/preview-image/)
+[文档以及 demo 地址](https://blog.jikun.dev/docs/preview-image.html)
 
 ## API
 
 | 属性             | 说明                         | 参数类型     | 默认值 |
 | ---------------- | :--------------------------- | :----------- | :----- |
 | src              | 预览图片的地址               | String/Array | -      |
 | visiable/v-model | 是否显示预览窗口             | Boolean      | false  |
-| initial-index | 默认显示图片的下标             | Number      | 0  |
+| initial-index    | 默认显示图片的下标           | Number       | 0      |
 | z-index          | 预览窗口的层级-css 的 zIndex | Number       | 9000   |
 
 ## 更新日志
 
+### v2.8.0
+
+feat：
+
+- 更改打包后文件的格式,es 格式文件后缀改为 `.mjs`
+
 ### v2.6.0
 
 feat:
 
 - 增加下载功能
-- 统一icon
+- 统一 icon
 
 ### v2.4.1
 
-*   fix:
-    -   修复css导入错误
+fix:
+
+- 修复 css 导入错误
 
 ### v2.4.0
 
-*   feat:
-    -   增加默认显示第几张图片的功能
+feat:
+
+- 增加默认显示第几张图片的功能
 
 ### v2.3.0
 
-*   feat:
-    -   增加显示当前图片下标的功能(仅在多图下显示)
+feat:
+
+- 增加显示当前图片下标的功能(仅在多图下显示)
 
 ### v2.0.0
 
-*   feat:
-    -   增加 vue3 支持（安装：npm i fox-preview-image@next）
+feat:
+
+- 增加 vue3 支持（安装：npm i fox-preview-image@next）
 
 ### v1.1.3
 
-*   refactor:
+refactor:
 
-    -   删除冗余代码
+- 删除冗余代码
 
 ### v1.1.2
 
-*   fix：
+fix：
 
-    -   修复火狐浏览器拖拽失效的问题
+- 修复火狐浏览器拖拽失效的问题
 
 ### v1.1.1
 
-*   feat：
-    -   支持鼠标滚轮放大缩小
+feat：
+
+- 支持鼠标滚轮放大缩小
 
 ### v1.1.0
 
-*   feat：
-    -   增加缩放倍数显示
+- feat：
+  - 增加缩放倍数显示
 
 ### v1.0.2
 
-*   fix:
-    -   修复当预览的图片为 1 张时扔显示左右切换按钮的问题
+fix:
+
+- 修复当预览的图片为 1 张时扔显示左右切换按钮的问题
 
 ### v1.0.1
 
-*   fix:
-    -   修复拖拽时图片未完全跟随鼠标的 bug
+fix:
+
+- 修复拖拽时图片未完全跟随鼠标的 bug
 
 ### v1.0.0
 
-*   feat:
-    -   旋转
-    -   放大，缩小（0.5-2）
-    -   多张图片可以传数组 eg：['http://xxxx.com/a.png','http://xxxx.com/b.png']
+feat:
+
+- 旋转
+- 放大，缩小（0.5-2）
+- 多张图片可以传数组 eg：['http://xxxx.com/a.png','http://xxxx.com/b.png']

package.json

@@ -1,7 +1,7 @@
 {
   "name": "fox-preview-image",
   "description": "一个支持vue2和vue3的预览图片组件",
-  "version": "2.8.0",
+  "version": "2.8.1",
   "main": "lib/preview-image.js",
   "module": "lib/preview-image.mjs",
   "browser": "lib/preview-image.js",

src/App.vue

@@ -2,7 +2,7 @@
 import { ref } from 'vue'
 import a from './assets/a.jpg'
 import b from './assets/logo.png'
-import { FoxPreviewImage } from './components/preview-image/index'
+import FoxPreviewImage from './components/preview-image/index'
 
 const visible = ref<boolean>(false)
 const visible1 = ref<boolean>(false)

src/components/preview-image/index.ts

@@ -1,10 +1,8 @@
 import PreviewImage from './src/index.vue'
 import type { App } from 'vue'
 
-const install = (app: App) => {
+PreviewImage.install = (app: App) => {
   app.component(PreviewImage.name, PreviewImage)
 }
 
-export default install
-
-export const FoxPreviewImage = PreviewImage
+export default PreviewImage

vite.config.lib.ts

@@ -31,12 +31,11 @@ export default defineConfig({
       fileName: (format) => {
         if (format === 'es') {
           return 'preview-image.mjs'
-        } else {
-          return `preview-image.js`
         }
-      },
-      formats: ['umd', 'es']
+        return `preview-image.js`
+      }
     },
-    cssCodeSplit: false
+    cssCodeSplit: false,
+    minify: 'terser'
   }
 })