Vue3插件发布npm

1. npm init

创建package.json

2. tsc --init

创建tsconfig.json

"module": "esnext",

3. 安装依赖

npm install vue -D
npm install vite -D

配置打包命令

"scripts": {
"test": "echo "Error: no test specified" && exit 1",
"build": "vite build"
},

4. 新建src文件夹/新建index.ts

5. 新建vite.config.ts

import { defineConfig } from 'vite'
export default defineConfig({
  build:{
    lib:{
      // entry:resolve(__dirname, 'src/index.ts'),
      entry: 'src/index.ts',
      name: 'useRequest'
    },
    rollupOptions:{
      external:['vue'],
      output:{
        globals:{
          // 提供一个全局变量给umd使用
          // umd支持很多模式:amd cjs 全局变量模式
          useRequest:'useRequest'
        }
      }
    }
  }
})

8. npm run build打包

9. 配置package.json

"main": "dist/userequestdemo.umd.js",
"module": "dist/userequestdemo.mjs",
"files": [
     "dist",
     "index.d.ts"
 ],

{
  "name": "userequestdemo",
  "version": "1.0.0",
  "description": "A Vue hook for handling HTTP request",
  "main": "dist/userequestdemo.umd.js",
  "module": "dist/userequestdemo.mjs",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1",
    "build": "vite build"
  },
  "files": [
    "dist",
    "index.d.ts"
  ],
  "keywords": [
    "hook",
    "vue"
  ],
  "author": "hapi666",
  "license": "MIT",
  "devDependencies": {
    "vite": "^8.0.1",
    "vue": "^3.5.30"
  }
}

10. 首次发布

npm publish --access public

11. 更新版本

• 补丁版本：npm version patch (1.0.0 → 1.0.1)
• 次要版本：npm version minor (1.0.0 → 1.1.0)
• 主要版本：npm version major (1.0.0 → 2.0.0)

13. 注册npm www.npmjs.com/ 账号、邮箱、 密码

14. 生成token Token name：输入一个名字，如 publish-token Permissions (权限) ：选择 Read and Write Bypass two-factor authentication (绕过双因素认证) ：务必勾选此复选框 Expiration (过期时间) 立即复制它，关闭后将无法再次查看

npm config set //registry.npmjs.org/:_authToken=你的令牌

验证并发布：

npm whoami          # 应显示你的用户名，确认登录成功
npm publish --access public