README.md in bridgetown-lit-renderer-2.0.0 vs README.md in bridgetown-lit-renderer-2.1.0.beta1
- old
+ new
@@ -19,20 +19,28 @@
```shell
$ bin/bridgetown configure lit
```
-For a manual installation overview:
+For a manual installation overview (Bridgetown 1.2+):
-Run this command to add this plugin to your site's Gemfile, along with Lit and SSR support:
+Run this command to add this plugin to your site's Gemfile, along with JavaScript packages for Lit and SSR support:
```shell
-$ bundle add bridgetown-lit-renderer -g bridgetown_plugins
+$ bundle add bridgetown-lit-renderer
$ yarn add lit bridgetown-lit-renderer
```
+Then add the initializer to your configuration in `config/initializers.rb`:
+
+```ruby
+init :"bridgetown-lit-renderer"
+```
+
+(For Bridgetown 1.1 or earlier, [read these instructions](https://github.com/bridgetownrb/bridgetown-lit-renderer/tree/v2.0.0.beta3).)
+
Create a file in `config/lit-ssr.config.js` with the following:
```js
const build = require("bridgetown-lit-renderer/build")
const { plugins } = require("./esbuild-plugins.js")
@@ -73,9 +81,11 @@
Now add the following to the top of your `frontend/javascript/index.js` file:
```js
import "bridgetown-lit-renderer"
```
+
+(It's very important this comes _before_ loading any other JavaScript code which might make use of Lit, such as the Bridgetown Quick Search plugin.)
### Technical and Performance Considerations
The Bridgetown Lit render helper works by compiling your entry point together with your code block via esbuild and caching the resulting JS snippet. A second pass combines your `data` with the snippet and executes it via a temporary "sidecar" Node server which utilizes Lit's SSR rendering pipeline.