Loading repository data…
Loading repository data…
detroitenglish / repository
A superbly simple, minimal-config template for building, bundling and deploying Cloudflare Workers with Webpack 🚀
A transparent discovery signal based on current public GitHub metadata.
This score does not audit code, security, maintainers, documentation quality, or suitability. Verify the repository and its current documentation before adoption.
A superbly simple, minimal-config launchpad to build, bundle and deploy Cloudflare Workers with Webpack 🚀
NOTE: You should probably just use Cloudflare's official tool, Wrangler, at this point.
Webpack is the recommended means for Cloudflare Worker developers to leverage
npm's massive, modular ecosystem. But to those unfamiliar with Webpack's
black magic configuration, it can mean investing countless hours in
tooling-tweaks and .*rc-file-fiddling.
So the goal, here, is to provide a fiddle-free, Webpack-powered launchpad with default settings sane enough for almost any use case.
It'll bundle up your script and dependencies, upload your Worker to Cloudflare,
and even activate its route(s). The world's now yours to require('🌍')
require and other neat featuresClone this repository:
git clone git@github.com:detroitenglish/cloudflare-workers-webpack-boilerplate.git
cd cloudflare-workers-webpack-boilerplate
Rename example.env to , and add your required Cloudflare
credentials, and either your site name or site's zone-id.
.envInstall dependencies with npm install
Write your worker script in src/worker.js
npm install -P <some-npm-module>dist/bundled-worker.js
by running: npm run buildBuild, bundle and launch your minion Worker to the Cloudflare Edge 🚀
using: npm run deploy
A ready-to-rock example Worker script can be found in src/example.worker.js.
The example Worker require()s
lodash.sample, and uses it to
randomly choose a translation of the word 'hello'.
It then adds a response header in the form of:
x-worker-greeting: <random-hello>, world!
After completing steps 1-3 above, you can build the example script with
npm run build:example
You can deploy it live to your site with npm run deploy:example
To get the full experience, create a
KV Namespace
and add its namespace_id to src/example.metadata.json
The following are required in your .env file:
CLOUDFLARE_AUTH_EMAIL: Your Cloudflare account email address
CLOUDFLARE_AUTH_KEY: Your Cloudflare API-Key
You must provide a means of identifying your Cloudflare site deployment
target by defining (in .env) either:
CLOUDFLARE_ZONE_ID: The Zone ID to which your worker will be deployedor
CLOUDFLARE_SITE_NAME: The fully qualified domain name (FQDN) of your site,
e.g. example.lolMore options are defined and described in example.env
Webpack is configured to minify scripts before deployment in order to help keep your bundled Worker under the 1MB limit.
Building previews with npm run build will not minify scripts in order to
make debugging easier.
Worker script uploading and route pattern management are handled by the this
same author's
cloudflare-worker-webpack-plugin.
You can review the plugin's source code and documentation
here.
Babel is configured to let you use JavaScript syntaxes and features that are
supported in the latest version of Chrome, but not natively supported by
NodeJS, e.g. import "statements" or { ...objectSpreadSyntax }.
On build, Babel will only add polyfills to your bundled script if, after evaluating your code, it determines a polyfill is necessary for compatibility with the latest version of Chrome (a very unlikely scenario).
.env VariablesSee example.env for details and examples on adding and
injecting custom variables.
See example.env for details and examples on including a
metadata.json secrets file.
See example.env for details and examples on how route
patterns are parsed and deployed.
I am not a Cloudflare employee, so as a peasant my testing is limited to my own Workers, in my own zones for my own application in production.
So by all means, try to break stuff! And if something goes kaputt, please let me know by creating an issue.
PRs are very much welcome 👍
Committing will trigger - and must pass - linting and a few tests (...which there could be more of!)
Fork away!
Some ideas going forward:
But I'm very open to suggestions - please share your ideas by creating an issue.
Other than a happy customer, I am not affiliated with Cloudflare in any way.
Assume in good faith that I have no idea what I'm doing; REVIEW THE SOURCE, and use at your own risk 🙈