lw-upload-shell

简述

这里用的是阿里云，所有上传参数包活buckets写死的，没有配置灵活，有需要在说 换服务器重新改代码

引入

yarn add lw-upload-shell
或
npm i lw-upload-shell

项目配置

新建oss.config.js内可区分不同环境

const path  = require('path')
const assets = path.resove(__dirname, 'src/assets') // 根据项目自己配置
const env = process.env.APP_ENV
module.exports = {
  assets: assets, // 上传文件目录
  folder: env, // 传到服务器的文件夹 同个bucket 区分不同文件夹就好
}

node script

"dev-up": "APP_ENV=dev oss-up"
"pro-up": "APP_ENV=pro oss-up"

webpack配合

图片既然上传了，那么配合webpack我们需要把相应的地址换成线上的，而在使用的时候我们就要统一 1.使用自制loader，太简单没必要发包了，有需要再说,最好改成参数配置的loader，这里简单展示 不多说了。

例如：本地创建loaders文件夹下index-loader.js

module.exports =  function (source) {
  return source.replace(/@oss/g,'https://gxm-gf.oss-cn-beijing.aliyuncs.com')
}

webpack.config.js使用

  resolveLoader: {
    modules: ['node_modules',path.resolve(__dirname,'loaders/')]
  }

2.项目中使用图片，对应文件夹写就好了 例如：src/assets/a.png

项目中用：

<img src='@oss/a.png' />