1:先安装 npm install aliyunoss-webpack-plugin --save-dev2:直接看代码 文件名build.oss.testvar ossWebpackUpload = require(aliyunoss-webpack-plugin)/**初始话 */var ossLoad = new ossWebpackUpload({bui...
1:先安装 npm install aliyunoss-webpack-plugin --save-dev
2:直接看代码 文件名build.oss.test
var ossWebpackUpload = require('aliyunoss-webpack-plugin')
/**初始话 */
var ossLoad = new ossWebpackUpload({
buildPath: 'dist/**',
region: 'oss-cn-hubei[实际region]',//这里只填地域部分,不要复制的太全了
accessKeyId: '您的key',
accessKeySecret: '您的密钥',
bucket: 'test-vue-oss[您的实际bucket]',
deleteAll: true,
generateObjectPath: function(filename,file) {
return file.replace(/dist\//, '');
},
getObjectHeaders: function(filename) {
return {
Expires: 6000
}
}
});
/**上传 */
ossLoad.apply()
使用说明:
1:若想先打包,后上传 可以直接配置package.json上传的命令如:“build-oss-test”: “node build/build.oss-test.js”
然后先正常build 然后再 npm run build-oss-test
2:若想打包时就直接上传到oss
可以在对应环境的build-test.js下方中加入const ossUpload = require('build.oss.test')
注意路径
下面是部分贴图
webpack(webpackConfig, (err, stats) => {
spinner.stop()
if (err) throw err
process.stdout.write(stats.toString({
colors: true,
modules: false,
children: false,
chunks: false,
chunkModules: false
}) + '\n\n')
if (stats.hasErrors()) {
console.log(chalk.red(' Build failed with errors.\n'))
process.exit(1)
}
console.log(chalk.cyan(' Build complete.\n'))
console.log(chalk.yellow(
' Tip: built files are meant to be served over an HTTP server.\n' +
' Opening index.html over file:// won\'t work.\n'
))
const ossUpload = require('build.oss.test') //其他不要动,只需要加这里
})
个人感觉放在这里可以保证打包成功之后才上传,如果放在打包的conf.js里面,会出现 仅仅上传了index
本文标题为:vue打包成功后直接将文件上传到oss
- jsPlumb+vue创建字段映射关系 2023-10-08
- ajax实现输入提示效果 2023-02-14
- JS实现左侧菜单工具栏 2022-08-31
- vue keep-alive 2023-10-08
- 基于CORS实现WebApi Ajax 跨域请求解决方法 2023-02-14
- 关于 html:如何从 css 表中删除边距和填充 2022-09-21
- 深入浅析AjaxFileUpload实现单个文件的 Ajax 文件上传库 2022-12-15
- 1 Vue - 简介 2023-10-08
- javascript 判断当前浏览器版本并判断ie版本 2023-08-08
- layui数据表格以及传数据方式 2022-12-13