Skip to content
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
5 changes: 5 additions & 0 deletions .changeset/curly-poets-explode.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,5 @@
---
'@powersync/web': patch
---

Added a bin/cli utilty that can be invoked with `npx powersync-web copy-assets` or `pnpm powersync-web copy-assets`.
6 changes: 3 additions & 3 deletions demos/react-native-web-supabase-todolist/README.md
Original file line number Diff line number Diff line change
Expand Up @@ -50,7 +50,7 @@ bucket_definitions:

### Configure the app

#### 1. Set up environment variables:
#### 1. Set up environment variables:

Copy the `.env.local.template` file:

Expand All @@ -65,7 +65,7 @@ Then edit `.env.local` to insert your Supabase and PowerSync project credentials
This is required for the React Native Web implementation. Learn more in [our docs](https://docs.powersync.com/client-sdk-references/react-native-and-expo/react-native-web-support).

```bash
mkdir -p public/@powersync && cp -r node_modules/@powersync/web/dist/* public/@powersync/
pnpm powersync-web copy-assets
```

### Run the app
Expand All @@ -88,4 +88,4 @@ Run on Android:

```sh
pnpm android
```
```
11 changes: 10 additions & 1 deletion packages/web/README.md
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,7 @@

# PowerSync SDK for Web

*[PowerSync](https://www.powersync.com) is a sync engine for building local-first apps with instantly-responsive UI/UX and simplified state transfer. Syncs between SQLite on the client-side and Postgres, MongoDB or MySQL on the server-side.*
_[PowerSync](https://www.powersync.com) is a sync engine for building local-first apps with instantly-responsive UI/UX and simplified state transfer. Syncs between SQLite on the client-side and Postgres, MongoDB or MySQL on the server-side._

This package (`packages/web`) is the PowerSync SDK for JavaScript Web clients. It is an extension of `packages/common`.

Expand Down Expand Up @@ -40,6 +40,15 @@ See the [example Vite config](https://github.com/powersync-ja/powersync-js/blob/

Our [full SDK reference](https://docs.powersync.com/client-sdk-references/js-web) contains everything you need to know to get started implementing PowerSync in your project.

# Public Workers

For some frameworks, it may be required to configure the web workers ([see the docs](https://docs.powersync.com/client-sdk-references/react-native-and-expo/react-native-web-support)).
The `@powersync/web` package includes a CLI utility which can copy the required assets to the `public` directory (configurable with the `--output` option).

```bash
pnpm powersync-web copy-assets
```

# Changelog

A changelog for this SDK is available [here](https://releases.powersync.com/announcements/powersync-js-web-client-sdk).
Expand Down
43 changes: 43 additions & 0 deletions packages/web/bin/powersync.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,43 @@
#!/usr/bin/env node

const { Command } = require('commander');
const program = new Command();
const path = require('path');
const fsPromise = require('fs/promises');
const { version } = require('../package.json');

program
.name('powersync-web')
.description('CLI for PowerSync Web SDK utilities')
.version(version);

program
.command('copy-assets')
.description('Copy assets to the specified output directory')
.option('-o, --output <directory>', 'output directory for assets', 'public')
.action(async(options) => {
const outputDir = options.output;

console.log(`Target directory: ${outputDir}`);

const cwd = process.cwd();
const source = path.join(cwd, 'node_modules', '@powersync', 'web', 'dist');
const destination = path.join(cwd, outputDir, '@powersync');

await fsPromise.rm(destination, { recursive: true, force: true }); // Clear old assets

await copyDirectory(source, destination)
});


program.parse(process.argv);

async function copyDirectory(source, destination) {
try {
await fsPromise.cp(source, destination, { recursive: true });
console.log(`Assets copied from ${source} to ${destination}`);
} catch (err) {
console.error(`Error copying assets: ${err.message}`);
process.exit(1);
}
}
5 changes: 5 additions & 0 deletions packages/web/package.json
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,11 @@
"description": "A Web SDK for JourneyApps PowerSync",
"main": "lib/src/index.js",
"types": "lib/src/index.d.ts",
"bin": {
"powersync-web": "bin/powersync.js"
},
"files": [
"bin",
"lib",
"!lib/tests",
"dist"
Expand Down Expand Up @@ -64,6 +68,7 @@
"async-mutex": "^0.4.0",
"bson": "^6.6.0",
"comlink": "^4.4.1",
"commander": "^12.1.0",
"js-logger": "^1.6.1"
},
"devDependencies": {
Expand Down
Loading