@jessitronica/hny-otel-web
v0.9.0
Published
can i make a package and publish it and use it from html
Downloads
136
Readme
My minimal wrapper around Honeycomb's SDK
Currently (November 2023), OpenTelemetry doesn't offer a single .js file that I can import in a script tag.
I want this so that my toy app can send spans to Honeycomb to tell me that someone hit the page, and when some JS threw an error.
This repository constructs a .js file, wrapping the OpenTelemetry libraries, using Parcel to bundle the necessary code up. It publishes the .js as a GitHub release.
Make your own distribution
I don't recommend using this; instead, I recommend copying it and making your own tiny distribution that does what you want and nothing else.
Use
<script src="https://unpkg.com/@jessitronica/[email protected]/dist/hny.js"></script>
<script>window.Hny.initializeTracing({debug: true, apiKey: "your-honeycomb-ingest-api-key", serviceName: "my-app"})</script>
This wrapper follows the Honeycomb docs as of now. (It's July 5th 2024)
Currently this results in a binary of almost 200k.
examples
See hny.js for the code.
See index.html for an example of use; but you'll change the script tag that brings it in, because that one expects hny.js
locally.
Development
Change something in otel.js,npm install
, and npm run build
. This builds a parcel target defined in package.json
. The output goes to dist/hny.js
.
To test, change index.html
and then run npm run futz
to copy it to dist and serve it. Load the page, and then check the dev tools. Network tab should show hits to /v1/traces
.
which won't work until you run a collector.
Run a local collector
Edit otel-local-config.yaml
and put a Honeycomb API key in the spot.
Start Docker.
./run-collector
Publish a new version
Update the version in package.json
and README.md
.
npm login
as jessitronica
npm publish --access public