Sign Up for Free

RunKit +

Try any Node.js package right in your browser

This is a playground to test code. It runs a full Node.js environment and already has all of npm’s 400,000 packages pre-installed, including qiniu-webpack-plugin with all npm packages installed. Try it out:

var qiniuWebpackPlugin = require("qiniu-webpack-plugin")

This service is provided by RunKit and is not affiliated with npm, Inc or the package authors.

qiniu-webpack-plugin v0.4.2

Webpack plugin for Qiniu cloud storage

qiniu-webpack-plugin

把 Webpack 打包出来的 assets 传到 七牛云存储上。

安装

npm install qiniu-webpack-plugin --save-dev

引入

var QiniuPlugin = require('qiniu-webpack-plugin');

配置

  • ACCESS_KEY,SECRET_KEY, bucket 与七牛云设置一致
  • path 存储的路径,默认为 [hash]
  • include 可选项。你可以选择上传的文件,比如['main.js']``或者[/main/]`

另外

  • Webpack 的 output.publicPath 要指向七牛云(或自定义的)域名地址

// 这里配置 Plugin
var qiniuPlugin = new QiniuPlugin({
  ACCESS_KEY: '',
  SECRET_KEY: '',
  bucket: 'my-qiniu-webpack',
  path: '[hash]'
});

// 这里是 Webpack 的配置
module.exports={
 output:{
    // 这里是七牛的域名加上 Webpack 的 hash
    publicPath:"http://7xs30h.com1.z0.glb.clouddn.com/[hash]/"
    // ..
 },
 plugins:[
   qiniuPlugin
   // ...
 ]
 // ...
}

示例代码

https://github.com/wyvernnot/qiniu-webpack-plugin/tree/master/example

该例子演示了

  • React + ES6 + Bootstrap 前端项目的编译执行
  • SoureceMap 存储
  • Webfont 存储
  • 图片 存储
  • 缓存处理
  • 开发和产品环境切换

版权声明

Qiniu 是上海七牛信息技术有限公司的注册商标, qiniu-webpack-plugin 是本人自己写的模块,非官方,采用 MIT 开源协议发布。

RunKit is a free, in-browser JavaScript dev environment for prototyping Node.js code, with every npm package installed. Sign up to share your code.
Sign Up for Free