|  | 
| 4 | 4 | 
 | 
| 5 | 5 | Swift framework to interact with JavaScript through WebAssembly. | 
| 6 | 6 | 
 | 
| 7 |  | -## Requirements | 
| 8 |  | - | 
| 9 |  | -This library only supports [`swiftwasm/swift`](https://github.com/swiftwasm/swift) distribution toolchain. The toolchains can be installed via [`swiftenv`](https://github.com/kylef/swiftenv) like official nightly toolchain. You can use the `install-toolchain.sh` helper script that does this for you: | 
| 10 |  | - | 
| 11 |  | -```sh | 
| 12 |  | -$ ./scripts/install-toolchain.sh | 
| 13 |  | -$ swift --version | 
| 14 |  | -Swift version 5.3-dev (LLVM 09686f232a, Swift 5a196c7f13) | 
| 15 |  | -Target: x86_64-apple-darwin19.6.0 | 
| 16 |  | -``` | 
| 17 |  | - | 
| 18 |  | -## Usage | 
|  | 7 | +## Getting started | 
| 19 | 8 | 
 | 
| 20 | 9 | This JavaScript code | 
| 21 | 10 | 
 | 
| @@ -66,4 +55,79 @@ let swiftPet: Pet = try JSValueDecoder().decode(from: jsPet) | 
| 66 | 55 | alert("Swift is running on browser!") | 
| 67 | 56 | ``` | 
| 68 | 57 | 
 | 
| 69 |  | -Please see [Example](https://github.com/swiftwasm/JavaScriptKit/tree/main/Example) directory for more information | 
|  | 58 | +### Usage in a browser application | 
|  | 59 | + | 
|  | 60 | +The easiest way to get started with JavaScriptKit in your browser app is with [the `carton` | 
|  | 61 | +bundler](https://carton.dev). | 
|  | 62 | + | 
|  | 63 | +As a part of these steps | 
|  | 64 | +you'll install `carton` via [Homebrew](https://brew.sh/) on macOS (unfortunately you'll have to build | 
|  | 65 | +it manually on Linux). Assuming you already have Homebrew installed, you can create a new app | 
|  | 66 | +that uses JavaScriptKit by following these steps: | 
|  | 67 | + | 
|  | 68 | +1. Install `carton`: | 
|  | 69 | + | 
|  | 70 | +``` | 
|  | 71 | +brew install swiftwasm/tap/carton | 
|  | 72 | +``` | 
|  | 73 | + | 
|  | 74 | +If you had `carton` installed before this, make sure you have version 0.6.1 or greater: | 
|  | 75 | + | 
|  | 76 | +``` | 
|  | 77 | +carton --version | 
|  | 78 | +``` | 
|  | 79 | + | 
|  | 80 | +2. Create a directory for your project and make it current: | 
|  | 81 | + | 
|  | 82 | +``` | 
|  | 83 | +mkdir SwiftWasmApp && cd SwiftWasmApp | 
|  | 84 | +``` | 
|  | 85 | + | 
|  | 86 | +3. Initialize the project from a template with `carton`: | 
|  | 87 | + | 
|  | 88 | +``` | 
|  | 89 | +carton init --template basic | 
|  | 90 | +``` | 
|  | 91 | + | 
|  | 92 | +4. Build the project and start the development server, `carton dev` can be kept running | 
|  | 93 | +   during development: | 
|  | 94 | + | 
|  | 95 | +``` | 
|  | 96 | +carton dev | 
|  | 97 | +``` | 
|  | 98 | + | 
|  | 99 | +5. Open [http://127.0.0.1:8080/](http://127.0.0.1:8080/) in your browser and a developer console | 
|  | 100 | +   within it. You'll see `Hello, world!` output in the console. You can edit the app source code in | 
|  | 101 | +   your favorite editor and save it, `carton` will immediately rebuild the app and reload all | 
|  | 102 | +   browser tabs that have the app open. | 
|  | 103 | + | 
|  | 104 | +You can also build your project with webpack.js and a manually installed SwiftWasm toolchain. Please | 
|  | 105 | +see the following sections and the [Example](https://github.com/swiftwasm/JavaScriptKit/tree/main/Example) | 
|  | 106 | +directory for more information in this more advanced use case. | 
|  | 107 | + | 
|  | 108 | +### Manual toolchain installation | 
|  | 109 | + | 
|  | 110 | +This library only supports [`swiftwasm/swift`](https://github.com/swiftwasm/swift) distribution | 
|  | 111 | +toolchain. The toolchain can be installed via [`swiftenv`](https://github.com/kylef/swiftenv), in | 
|  | 112 | +the same way as the official Swift nightly toolchain. | 
|  | 113 | + | 
|  | 114 | +You have to install the toolchain manually when working on the source code JavaScriptKit itself, | 
|  | 115 | +especially if you change anything in the JavaScript runtime parts. This is because the runtime is | 
|  | 116 | +embedded in `carton` and currently can't be replaced dynamically with the JavaScript code you've | 
|  | 117 | +updated locally. | 
|  | 118 | + | 
|  | 119 | +Just pass a toolchain archive URL for [the latest SwiftWasm 5.3 | 
|  | 120 | +snapshot](https://github.com/swiftwasm/swift/releases) appropriate for your platform: | 
|  | 121 | + | 
|  | 122 | +```sh | 
|  | 123 | +$ swiftenv install https://github.com/swiftwasm/swift/releases/download/swift-wasm-5.3-SNAPSHOT-2020-10-16-a/swift-wasm-5.3-SNAPSHOT-2020-10-16-a-macos-x86_64.tar.gz | 
|  | 124 | +``` | 
|  | 125 | + | 
|  | 126 | +You can also use the `install-toolchain.sh` helper script that uses a hardcoded toolchain snapshot: | 
|  | 127 | + | 
|  | 128 | +```sh | 
|  | 129 | +$ ./scripts/install-toolchain.sh | 
|  | 130 | +$ swift --version | 
|  | 131 | +Swift version 5.3-dev (LLVM 09686f232a, Swift 5a196c7f13) | 
|  | 132 | +Target: x86_64-apple-darwin19.6.0 | 
|  | 133 | +``` | 
0 commit comments