Skip to content

efureev/webpack-plugin-server-push

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

13 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Server Push Webpack Plugin

This plugin creates configs for HTTP/2 Server Push for Nginx and other web-server.

Install

yarn add -D @feugene/webpack-plugin-server-push # or  npm install -D @feugene/webpack-plugin-server-push

Using

Example #1: webpack.config.js

// vue.config.js const ServerPushWebpackPlugin = require('@feugene/webpack-plugin-server-push').default const vueConfig = { publicPath: '/', outputDir: 'dist', assetsDir: 'static', productionSourceMap: false, configureWebpack: { resolve: { alias: { '@': resolve('src'), }, }, plugins: [ new ServerPushWebpackPlugin({ target: 'nginx', options: { omitLocation: true, filename: 'nginx.server-push.conf', }, }) ], } } module.exports = vueConfig

This will generate a file dist/nginx.server-push.conf containing the following:

 http2_push /static/css/app.f908c0a3.css; http2_push /static/js/app.20460db2.js; http2_push /static/css/chunk-elementUI.5e0028e4.css; http2_push /static/js/chunk-elementUI.0911e193.js; http2_push /static/js/chunk-libs.06f73890.js; 

Include the generated nginx.server-push.conf into your nginx config. For example:

server { server_name mockery.dev;	listen 443 ssl http2;	ssl_certificate /usr/share/cert/server/servercert.pem; ssl_certificate_key /usr/share/cert/server/serverkey.pem; location / {	include nginx.server-push.conf; proxy_pass http://127.0.0.1:1115; proxy_redirect off; proxy_set_header Host $host; proxy_set_header X-Real-IP $remote_addr; proxy_set_header X-Forwarded-Proto $scheme; proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for; proxy_read_timeout 60s; proxy_connect_timeout 60s; } } 

Example #2: webpack.config.js

// webpack.config.js const ServerPushWebpackPlugin = require('@feugene/webpack-plugin-server-push').default module.exports = { entry: 'index.js', output: { path: __dirname + '/dist', publicPath: '/', filename: 'index_bundle.js' }, plugins: [ new ServerPushWebpackPlugin({ target:'nginx', options:{index: 'index.html' }}) ] }

This will generate a file dist/nginx.push.conf containing the following:

 location = / { http2_push /index_bundle.js; } 

Include the generated nginx.push.conf in main nginx.conf as below:

server { # listen on port 433 with https listen 443 ssl http2; server_name example.com; # ssl cert ssl_certificate /usr/share/cert/server/servercert.pem; ssl_certificate_key /usr/share/cert/server/serverkey.pem; # where the root here root /usr/share/app; # what file to server as index index index.html; # include nginx push conf to enable HTTP/2 server push include nginx.push.conf; } 

About

Create Nginx conf for assets bundle for Server Push (http2)

Topics

Resources

Stars

Watchers

Forks

Packages

No packages published

Contributors 2

  •  
  •