🌐 Expose your rsbuild dev server over the internet via ngrok — built for use with the LynxJS Native App Framework.
This plugin creates an ngrok tunnel for your dev server, sets the correct assetPrefix for remote access, and optionally integrates with @lynx-js/qrcode-rsbuild-plugin to generate a QR code for fast mobile testing.
⚠️ Disclaimer: This README and plugin were generated and written with the help of AI. It may contain inaccuracies.
I'm not affiliated with LynxJS or its maintainers — this was built independently for use with the LynxJS ecosystem.🛠️ Pull requests are welcome! If you notice something broken or unclear, feel free to contribute!
- 🔓 Automatically exposes your dev server using
ngrok - 🛠 Injects
assetPrefixintodevconfig for remote asset loading - 📱 (Optional) Displays a QR code with your public ngrok URL for mobile devices
- 📄 Logs activity to
logs.txtfor debugging
npm install ngrok ngrok-rsbuild-plugin @lynx-js/qrcode-rsbuild-plugin --save-devNGROK_TOKEN=your-ngrok-authtoken// rsbuild.config.ts or index.ts
import { pluginNgrok, setServer } from './ngrok-rsbuild-plugin'
export default {
plugins: [pluginNgrok()],
async setup() {
const config = await setServer({
host: 'localhost',
port: 3000,
});
return config;
}
}Returns modified server and dev config with an updated assetPrefix.
Initializes the plugin and exposes the ngrok URL via the rsbuild API. Optionally accepts:
{
schema?: (url: string) => any // defaults to { http: url }
}- You must have a valid
NGROK_TOKENset in your.envfile. - The plugin writes logs to
logs.txtin the project root. - The
ngrokURL is exposed viaapi.expose('lynx:rsbuild:ngrok', { ngrok_url }). - This module uses
custompatchto patch@lynx-js/rspeedy@^0.9.0, preventing it from automatically appending a port number to the ngrok URL. Make surecustompatchis installed and patched correctly if you encounter any URL formatting issues.
MIT