upload-to-ali

This component can upload file to Aliyun-OSS easily.

You can configure OSS information through environmental variables, customize domain, support multi-selection, limit file size, delete, paste to upload, drag and drop to upload, make files upload simpler.

中文文档

Feature

The upload function can be done with little oss configuration
Automatically compress pictures before uploading, and loading prompts during uploading, support picture display and deletion
With default styles and support customize
Can limit the size or the number of files to upload
Support paste screenshot to upload
Can drag and drop to upload
Can preivew img
support v-model

You can only set action props, that refers to upload url, the component has a default implement to post data to the url.

You can set request props to customize own upload function.

⬆Back to Top

Links

⬆ Back to Top

Install

yarn add @femessage/upload-to-ali

⬆Back to Top

Dotenv

Recommend using environment variables to configure upload parameters
With dotenv, we just need to write the environment variable in .env. With CI tools, this can meet the needs of using different configuration in different environments without change the source code.
Here are all can passed-in environment variables

# .env file
# these params are all optional
UPLOAD_ACTION=upload-url

OSS_BUCKET=your-bucket
OSS_REGION=oss-cn-beijing
OSS_DIR=oss-dir
OSS_CUSTOM_DOMAIN=cdn.xxx.com

dotenv document reference https://www.npmjs.com/package/dotenv

vue-cli3

vue-cli3 offers an easy solution to replace process.env, but it requires a pattern(VUEAPP*) to inject in client side. So we need to use dotenv-webpack's solution.

// vue.config.js
const Dotenv = require('dotenv-webpack')
module.exports = {
  configureWebpack: {
    plugins: [new Dotenv()]
  }
}

⬆Back to Top

Contributing

For those who are interested in contributing to this project, such as:

report a bug
request new feature
fix a bug
implement a new feature

Please refer to our contributing guide.

⬆ Back to Top

Contributors

Thanks goes to these wonderful people (emoji key):

_levy 💻 👀 🚇 📝 🤔	_Alvin 💻 👀	_listars 💻 👀 📖	_EVILLT 💻 📖	_{Donald Shen} 💻 📖 ⚠️	_OuZuYu 🐛	_轻剑快马 📖
_ColMugX 🐛	_{Rexer Wang} 🐛	_cjf 💻 📖