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
基础教程推荐
- 浅析canvas元素的html尺寸和css尺寸对元素视觉的影响 2024-04-26
- 关于文字内容过长,导致文本内容超出html 标签宽度的解决方法之自动换行 2023-10-28
- this[] 指的是什么内容 讨论 2023-11-30
- 浅谈Vue2和Vue3的数据响应 2023-10-08
- vue离线环境如何安装脚手架vue-cli 2025-01-19
- JS前端广告拦截实现原理解析 2024-04-22
- Ajax实现动态加载数据 2023-02-01
- CSS3的几个标签速记(推荐) 2024-04-07
- js禁止页面刷新与后退的方法 2024-01-08
- 基于Vue制作组织架构树组件 2024-04-08
