Skip to content
Merged
Show file tree
Hide file tree
Changes from 4 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
57 changes: 12 additions & 45 deletions pnpm-lock.yaml

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.