All credits to Oliver Green
Original work olsgreen/webpack-s3-pusher
This fork allows passing the endpoint as option to facilitate connecting to AWS compatible providers like DigitalOcean.
In addition, you can now pass the desired ACL to be applied to the uploaded files. By default, some providers set the file visibility to private which contradicts with the need of pushing content to CDN for high availability. Now the user can set the option acl to public-read to force public visibility.
A webpack plugin that pushes your packed assets to S3 compatible bucket, no more, no less.
For webpack < 4 support use version 1.x
npm install webpack-s3-pusher-adapted --save-dev
new S3PusherPlugin({
// Target bucket
bucket: 'BUCKET',
// Set the credentials.
key: 'KEY',
secret: 'SECRET',
// If you are using Amazon S3 then only set region.
// However if you are using some other provider then set only endpoint.
// Region and endpoint both should not be set together.
region: 'us-west-2',
// endpoint: 'https://sgp1.digitaloceanspaces.com,
// Publish to a folder instead of root directory
prefix: 'assets',
// Include css & js files
include: '/.*\.(css|js)/',
// Exclude minified JS files
exclude: '/.*.min.js/',
// Remove files from the bucket before upload.
remove: [
'path/to/file1.js',
'path/to/file2.js',
],
// If you are not using a bucket with default public permissions
acl: 'public-read',
// Set Cache-Control header
cache: 'max-age=602430'
})
You can also use a credentials file from AWS rather than passing them
.env
S3_KEY=your_key
S3_SECRET=your_secret
S3_BUCKET=your_bucket
APP_ASSETS_AWS_KEY=your_key
APP_ASSETS_AWS_SECRET=your_secret
APP_ASSETS_AWS_REGION=your_region
APP_ASSETS_AWS_BUCKET=your_bucket
APP_ASSETS_AWS_ENDPOINT=your_endpoint
APP_ASSETS_AWS_ACL=your_acl
APP_CDN_URL=http://my-bucket.s3-website.eu-west-2.amazonaws.com
webpack.mix.js:
# If you are using Amazon S3 then only set region.
# However if you are using some other provider then only set endpoint.
# Region and endpoint both should not be set together.
S3_REGION=your_region
# S3_ENDPOINT=your_endpoint
webpack.mix.js
const mix = require('laravel-mix');
const S3PusherPlugin = require('webpack-s3-pusher');
if (mix.inProduction()) {
mix.webpackConfig({
plugins: [
new S3PusherPlugin({
key: process.env.S3_KEY,
secret: process.env.S3_SECRET,
bucket: process.env.S3_BUCKET,
region: process.env.S3_REGION,
// endpoint: process.env.S3_ENDPOINT,
prefix: 'assets',
acl: 'public-read',
cache: 'max-age=602430'
})
]
});
}
mix.js('resources/js/app.js', 'public/js')
.postCss('resources/css/app.css', 'public/css');
Push assets to bucket
npm run production
Pull requests are welcome. For major changes, please open an issue first to discuss what you would like to change.