proxypack
v0.3.2
Published
ProxyPack allows you to run your local WebPack build against production by creating a Proxy server and intercepting asset requests.
Downloads
2
Readme
ProxyPack
ProxyPack is WebPack Plugin that allows you to serve Local Assets from Wepack against a Production Website in a Web Browser
Table of Contents
API
| Value | Type | Of | | ---------------- | ------ | ------------------------------------------------------- | | browser | String | chrome, chromium, firefox, ie, opera, safari, phantomjs | | domain | String | WebSite URL | | localMappings | Dict | Mappings of files on the local file system | | externalMappings | Dict | Production Assets / Folders |
Webpack Setup
Example 1:
Import the ProxyPackPlugin:
const ProxyPackPlugin = require('@helpscout/proxypack').WebpackPlugin
In Webpack config add the following:
new ProxyPackPlugin({
browser: 'chrome',
domain: 'https://secure.helpscout.net',
})
External Mappings
You can also target Non-Webpack files or other Webpack builds with the dictionary externalMappings
, these will be resolved with a standard HTTP GET REQUEST
.
new ProxyPackPlugin({
browser: 'chrome',
domain: 'https://secure.helpscout.net',
externalMappings: {
' https://beacon-v2.helpscout.net/static/js/main.2.1.f3df77f2.js': 'http://localhost:3001/static/js/main.2.1.js'
}
,
})
In this example we are actually running another Webpack server where http://localhost:3001/static/js/main.2.1.js
is built and we are linking that from our Proxy Server.
Local Mappings
Local Mappings are resolved as UTF8
through fs.readFileSync()
, and are for paths that are on the local file system.
new ProxyPackPlugin({
browser: 'chrome',
domain: 'https://secure.helpscout.net',
localMappings: {
'https://dhmmnd775wlnp.cloudfront.net/*/css/styles.css' : `${__dirname}/site/css/styles.css`
},
Install
Install the package globally; npm install @helpscout/proxypack -g
.
Then run proxypack --install
.
This will install an SSL certificate CLI commands that can launch a Proxied Web Browser that is aware of the ProxyServer running via Webpack.
For example the command proxypack
will open a Proxied Web Browser in chrome
.
You can pass the browser
and / or domain
flag, to target specific builds and override the values in ProxyPackPlugin
config.
For example: proxypack --domain=https://secure.helpscout.net --browser=firefox
. Will open https://secure.helpscout.net
in Firefox
and Proxy all the Webpack assets and other mapped local or external assets.
Thanks
ProxyPack was inspired by Charles Proxy and James Proxy and was built with Hoxy.