chore: upgrade to v3.2.0

.github/workflows/ci.yml

@@ -2,17 +2,21 @@ name: Continuous Integration
 
 on: [push]
 
+permissions:
+  contents: read
+
 jobs:
   continuous-integration:
     name: Continuous Integration
     runs-on: ubuntu-latest
     timeout-minutes: 10
     steps:
-      - uses: actions/checkout@v4
+      - uses: actions/checkout@v7
 
-      - uses: actions/setup-node@v4
+      - uses: actions/setup-node@v7
         with:
           node-version-file: .nvmrc
+          cache: npm
 
       - name: Install dependencies
         run: npm ci

.nvmrc

@@ -1 +1 @@
-20
+24

README.md

@@ -1,37 +1,37 @@
 # featurevisor-example-nuxt
 
-Look at the [Nuxt 3 documentation](https://nuxt.com/docs/getting-started/introduction) to learn more.
+Example of using the [Featurevisor JavaScript SDK](https://featurevisor.com/docs/sdks/javascript/) in a [Nuxt](https://nuxt.com) application.
 
-For Featurevisor documentation, visit [https://featurevisor.com](https://featurevisor.com).
+The application loads a published Featurevisor datafile once, keeps a shared SDK instance, and evaluates `my_feature` during rendering.
 
 ## Setup
 
 Make sure to install the dependencies:
 
-```
-$ npm install
+```sh
+npm ci
 ```
 
 ## Development Server
 
 Start the development server on `http://localhost:3000`:
 
-```
-$ npm run dev
+```sh
+npm run dev
 ```
 
 ## Production
 
 Build the application for production:
 
-```
-$ npm run build
+```sh
+npm run build
 ```
 
 Locally preview production build:
 
-```
-$ npm run preview
+```sh
+npm run preview
 ```
 
 Check out the [deployment documentation](https://nuxt.com/docs/getting-started/deployment) for more information.

app.vue → app/app.vue

@@ -16,7 +16,10 @@ const isEnabled = f.isEnabled(featureKey, context);
     <p v-if="isEnabled">Feature is enabled!</p>
     <p v-else>Feature is disabled :(</p>
 
-    <p>Learn more at <a href="https://featurevisor.com">https://featurevisor.com</a></p>
+    <p>
+      Learn more at
+      <a href="https://featurevisor.com">https://featurevisor.com</a>
+    </p>
   </div>
 </template>
 

app/featurevisor.ts

@@ -0,0 +1,33 @@
+import { createFeaturevisor, type Featurevisor } from "@featurevisor/sdk";
+
+const DATAFILE_URL =
+  "https://featurevisor-example-cloudflare.pages.dev/production/featurevisor-tag-all.json";
+
+let instance: Featurevisor | undefined;
+let pendingInstance: Promise<Featurevisor> | undefined;
+
+export async function getInstance() {
+  if (instance) {
+    return instance;
+  }
+
+  if (!pendingInstance) {
+    pendingInstance = fetch(DATAFILE_URL)
+      .then((response) => {
+        if (!response.ok) {
+          throw new Error(`Request failed with status ${response.status}`);
+        }
+
+        return response.json();
+      })
+      .then((datafile) => {
+        instance = createFeaturevisor({ datafile });
+        return instance;
+      })
+      .finally(() => {
+        pendingInstance = undefined;
+      });
+  }
+
+  return pendingInstance;
+}

nuxt.config.ts

@@ -4,4 +4,4 @@ export default defineNuxtConfig({
   build: {
     transpile: ["@featurevisor/sdk"],
   },
-})
+});