# oss-publish-webpack-plugin > a webpack(V3/V4) plugin for publish vue project to Aliyun OSS and Qiniu Kodo. Latest version **1.5.1** (published 2023-01-17) · MIT license · 0 weekly downloads ## Install ```sh npm install oss-publish-webpack-plugin pnpm add oss-publish-webpack-plugin yarn add oss-publish-webpack-plugin bun add oss-publish-webpack-plugin ``` ## Health **Score 15/100 (F)** — status: abandoned. Positive: no vulnerabilities. Warnings: low downloads; no types; no esm support. Negative: abandoned; low maintenance score. ## Facts | | | |---|---| | Version | 1.5.1 | | Published | 2023-01-17 | | First published | 2022-12-27 | | Weekly downloads | 0 | | License | MIT | | TypeScript types | none | | Module format | CommonJS | | Dependencies | 7 | | Unpacked size | 30 KB | | Known vulnerabilities | 0 | | Install scripts | no | | GitHub stars | 2 | | Author | LXHFIGHT | | Maintainers | lxhfight | | Keywords | webpack, webpack-plugin, vue | ## Links - npm: https://www.npmjs.com/package/oss-publish-webpack-plugin - Repository: https://github.com/LXHFIGHT/oss-publish-webpack-plugin - Homepage: https://github.com/LXHFIGHT/oss-publish-webpack-plugin#readme - Issues: https://github.com/LXHFIGHT/oss-publish-webpack-plugin/issues - npm.io page: https://npm.io/package/oss-publish-webpack-plugin ## Dependencies (7) - [ora](https://npm.io/package/ora.md) ^1.2.0 - [chalk](https://npm.io/package/chalk.md) ^2.4.2 - [qiniu](https://npm.io/package/qiniu.md) ^7.8.0 - [ali-oss](https://npm.io/package/ali-oss.md) ^6.17.1 - [esdk-obs-nodejs](https://npm.io/package/esdk-obs-nodejs.md) ^3.21.6 - [cos-nodejs-sdk-v5](https://npm.io/package/cos-nodejs-sdk-v5.md) ^2.11.19 - [@aws-sdk/client-s3](https://npm.io/package/@aws-sdk/client-s3.md) ^3.245.0 ## Alternatives - [raw-loader](https://npm.io/package/raw-loader.md) — 4.3M weekly downloads - [plop](https://npm.io/package/plop.md) — 1.4M weekly downloads - [webpack-deadcode-plugin](https://npm.io/package/webpack-deadcode-plugin.md) — 80.3K weekly downloads - [@storybook/preact-vite](https://npm.io/package/@storybook/preact-vite.md) — 54.2K weekly downloads - [vite-plugin-transform](https://npm.io/package/vite-plugin-transform.md) — 2.4K weekly downloads ## Recent versions - 1.5.1 (latest) — 2023-01-17 - 1.5.0 — 2023-01-17 - 1.4.0 — 2023-01-16 - 1.3.0 — 2023-01-09 - 1.2.3 — 2023-01-03 - 1.2.2 — 2022-12-30 - 1.2.1 — 2022-12-29 - 1.2.0 — 2022-12-29 - 1.1.0 — 2022-12-29 - 1.0.3 — 2022-12-29 - 1.0.2 — 2022-12-29 - 1.0.1 — 2022-12-28 - 1.0.0 — 2022-12-28 - 0.9.0 — 2022-12-28 - 0.3.0 — 2022-12-27 - … 3 more at https://npm.io/package/oss-publish-webpack-plugin/versions ## README

OSS Publish Webpack Plugin

A webpack(V3/V4) plugin for publish vue project to
Aliyun OSS, Qiniu Kodo and TencentCloud COS.

Install

```shell npm i --save-dev oss-publish-webpack-plugin ```

Usage

该插件可以帮助你在完成前端单页面应用项目在完成编译打包后，将 `dist` 目录中的内容发布到云计算运营商的对象存储桶（空间）中，点此 [查看](#support) 目前已支持（和计划支持）的云计算运营商情况。 ### 1. webpack.config.js 配置 下面仅为示例代码，具体详细描述查看下文 [构造方法参数描述](#OPTIONS) ```javascript const OSSPublishPlugin = require('oss-publish-webpack-plugin') module.exports = { // ...... plugins: [ // ...... 等其他webpack插件 new OSSPublishPlugin({ // 构造方法配置参数, 下面仅为示例，具体描述见后面构造方法参数描述 provider: 'qiniu', providerConfig: { region: 'Zone_z2', accessKey: 'P********************b', secretKey: 'd********************A', bucket: '{bucketName}' }, autoPublish: true, clearPrefixList: ['static/css', 'static/js', 'static/img'] }) ] } ``` ### 2. vue.config.js 配置（基于 [webpack-chain](https://github.com/neutrinojs/webpack-chain) ） 下面仅为示例代码，具体详细描述查看下文 [构造方法参数描述](#OPTIONS) ```javascript const OSSPublishPlugin = require('oss-publish-webpack-plugin') module.exports = { // ...... chainWebpack: config => { // ......其他 config 定义逻辑, // Tips: chain-webpack模式支持通过逻辑代码根据当前环境使用对应的发布配置 config.plugin('oss-plugin').use(OSSPublishPlugin, [{ provider: 'qiniu', providerConfig: { /** ...同上 */ }, autoPublish: true, clearPrefixList: ['static/css', 'static/js', 'static/img'] }]) } } ```

Options

以下具体介绍 `oss-publish-webpack-plugin` 支持的构造方法参数 |参数名 | 描述 |类型 | 默认值 | |:-- |:--|:-- |:--| | `provider` | 云计算运营商标识（详见下文 `provider` 介绍） | String | 'aliyun' | | `providerConfig` 重要 |运营商SDK对应工具方法的配置对象（详见下文 `providerConfig` 介绍）| Object | -- | | `clearPrefixList` |每次上传文件前需要清空存储桶中文件前缀，如果不传或空数组则代表不需要清空| Array | [] | | `autoPublish` | 是否无需命令行询问直接在编译后上传云端, true表示直接上传，false则需要询问后发布 | Boolean | false| | `answer` | 当 `autoPublish` 为false时，定义发布前命令行询问后填写的正确回复选项，输入数组内任一值都允许发布 | Array | ['y','Y','yes'] | | `thread` | 定义最多支持同时执行的上传任务数，性能和网速越强，数额可以设置越大，建议取数在 1~10之间 | Number | 5 |
### provider 云计算运营商标识
| 运营商名称 | 标识 | 状态 | 支持日期 | |:-- |:--|:--|:--| |[阿里云 OSS](#aliyun) | aliyun | V0.3.0 已支持 | 2022-12-27 | |[七牛云 Kodo](#qiniu) | qiniu | V0.9.0 已支持 | 2022-12-28 | |[腾讯云 COS](#tencent) | tencent | v1.2.0 已支持 | 2022-12-29 | |[华为云 OBS](#huaweicloud) | huaweicloud | v1.4.0 已支持 | 2023-01-16 | |[亚马逊云 S3](#aws) | aws | v1.5.0 BETA | 2023-01-17 |
### providerConfig 对象存储配置详述
1. **阿里云 OSS** |参数名 | 类型 | 描述 | |:-- |:--|:-- | |region | String | 存储桶所在地域名称，以华东1（杭州）为例，Region填写为oss-cn-hangzhou，点击[查看公共云下OSS Region详细对照表](https://help.aliyun.com/document_detail/31837.html) | |accessKeyId | String | 阿里云账号的accessKeyId。注意：阿里云账号AccessKey拥有所有API的访问权限，风险很高。强烈建议您创建并使用RAM用户进行API访问或日常运维，请登录RAM控制台创建RAM用户 | |accessKeySecret | String | 阿里云账号的accessKeySecret | |bucket | String | 存储桶的名称 |
2. **七牛云 Kodo** |参数名 | 类型 | 描述 | |:-- |:--|:-- | |region | String | 存储空间所在地域标识：华东 Zone_z0、 华北 Zone_z1、 华南 Zone_z2 和 北美 Zone_na0 | |accessKey | String | 七牛云账号的accessKey | |secretKey | String | 七牛云账号的secretKey | |bucket | String | 存储空间的名称 |
3. **腾讯云 COS** |参数名 | 类型 | 描述 | |:-- |:--|:-- | |region | String | 腾讯云存储桶托管机房分布地区的地域标识，以广州为例，Region填写为ap-guangzhou，点击[查看公有云地域列表](https://cloud.tencent.com/document/product/436/6224#.E4.B8.AD.E5.9B.BD.E5.A4.A7.E9.99.86.E5.9C.B0.E5.9F.9F) | |secretId | String | 腾讯云账号的secretId | |secretKey | String | 腾讯云账号的secretKey | |bucket | String | 存储桶的名称 |
4. **华为云 OBS** |参数名 | 类型 | 描述 | |:-- |:--|:-- | |server | String | 华为云存储桶地域标识（EndPoint），在存储桶 -> 概览 -> 基本信息 中即可查到 EndPoint | |access_key_id | String | 华为云账号的访问密钥ID | |secret_access_key | String | 华为云账号的访问密钥 | |bucket | String | 存储桶的名称 |
5. **AWS S3** |参数名 | 类型 | 描述 | |:-- |:--|:-- | |region | String | 亚马逊云存储空间服务所在地域标识（EndPoint），点此[查看AWS服务端点列表](https://docs.aws.amazon.com/general/latest/gr/rande.html#s3_region) | |accessKeyId | String | 亚马逊云账号的访问密钥ID | |secretAccessKey | String | 亚马逊云账号的访问密钥 | |bucket | String | 存储桶的名称 |

Guide

### 阿里云OSS存储桶配置引导 * 查看阿里云 [教程示例：通过静态网站托管部署单页应用](https://help.aliyun.com/document_detail/396285.html) ### 七牛云kodo存储桶配置引导 * 查看七牛云 [静态页面管理](https://developer.qiniu.com/kodo/8604/a-static-page-management) 引导说明 【温馨提示：本插件会将编译打包后的 `dist` 目录中 `index.html` 文件复制出一个新的文件并命名为 `errno-404`，同时会一并上传到七牛云存储空间，不需要开发者再单独操作】 ### 腾讯云COS存储桶配置引导 * 查看腾讯云 [使用 COS 静态网站功能搭建前端单页应用](https://cloud.tencent.com/document/product/436/64575) * 查看搭建前端单页应用过程中的 [常见问题](https://cloud.tencent.com/document/product/436/64575#.E5.B8.B8.E8.A7.81.E9.97.AE.E9.A2.98) ### 华为云OBS存储桶配置引导 * 查看华为云 [使用自定义域名托管静态网站最佳实践](https://support.huaweicloud.com/bestpractice-obs/obs_05_0610.html) * 注意：默认404错误页面这里需要也配置为： `index.html` ![](https://support.huaweicloud.com/bestpractice-obs/zh-cn_image_0000001345671781.png) ### 亚马逊云 S3 存储桶配置引导 验证中，后续补充... --- _Source: https://npm.io/package/oss-publish-webpack-plugin · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._