Merge remote-tracking branch 'origin/main' into renovate/third-party-…

…capital-3.x

CHANGELOG.md

@@ -1,6 +1,29 @@
 # Changelog
 
 
+## v0.9.4
+
+[compare changes](https://github.com/nuxt/scripts/compare/v0.9.3...v0.9.4)
+
+### 🩹 Fixes
+
+- **matomo:** Easier cloud config using `cloudId` ([d7e18c4](https://github.com/nuxt/scripts/commit/d7e18c4))
+- **matomo:** Support numeric `siteId` ([299516c](https://github.com/nuxt/scripts/commit/299516c))
+- Avoid overriding `<link rek="preload"` with invalid src ([25f1ade](https://github.com/nuxt/scripts/commit/25f1ade))
+
+### 📖 Documentation
+
+- Fix docs for disabling scripts in development ([#281](https://github.com/nuxt/scripts/pull/281))
+
+### 🏡 Chore
+
+- Bump deps ([931f4f6](https://github.com/nuxt/scripts/commit/931f4f6))
+
+### ❤️ Contributors
+
+- Harlan ([@harlan-zw](http://github.com/harlan-zw))
+- Paul ([@schnetzi](http://github.com/schnetzi))
+
 ## v0.9.3
 
 [compare changes](https://github.com/nuxt/scripts/compare/v0.9.2...v0.9.3)

client/package.json

@@ -12,7 +12,7 @@
   },
   "devDependencies": {
     "@iconify-json/carbon": "^1.2.1",
-    "@nuxt/devtools-kit": "^1.5.0",
+    "@nuxt/devtools-kit": "^1.5.1",
     "@nuxt/devtools-ui-kit": "latest",
     "@nuxt/kit": "^3.13.2",
     "nuxt": "latest",

docs/content/docs/1.getting-started/2.installation.md

@@ -8,7 +8,7 @@ description: Learn how to create a Nuxt Scripts project or add it to your curren
 To get started, simply run:
 
 ```bash
-npx nuxi@latest module add @nuxt/scripts
+npx nuxi@latest module add scripts
 ```
 
 That's it! The Nuxt Scripts module should be downloaded and added to your Nuxt Config `modules`.

docs/content/docs/1.guides/1.registry-scripts.md

@@ -98,14 +98,17 @@ You can do this by providing a `mock` value to the registry script.
 
 ```ts [nuxt.config.ts]
 export default defineNuxtConfig({
-  $production: {
+  scripts: {
+    registry: {
+      googleTagManager: true,
+    },
+  },
+  $development: {
     scripts: {
       registry: {
-        googleAnalytics: {
-          id: 'YOUR_ID',
-        },
-      }
-    }
+        googleTagManager: "mock",
+      },
+    },
   },
 })
 ```

docs/content/scripts/analytics/matomo-analytics.md

@@ -17,8 +17,9 @@ use the [useScriptMatomoAnalytics](#useScriptMatomoAnalytics) composable.
 
 ## Loading Globally
 
-If you don't plan to send custom events you can use the [Environment overrides](https://nuxt.com/docs/getting-started/configuration#environment-overrides) to
-disable the script in development.
+The following config assumes you're using Matomo Cloud with the default `siteId` of `1`. 
+
+If you're self-hosting, you'll need to provide the `matomoUrl` instead. If you have other sites you want to track, you can add them using `siteId`.
 
 ::code-group
 
@@ -27,7 +28,7 @@ export default defineNuxtConfig({
   scripts: {
     registry: {
       matomoAnalytics: {
-        siteId: 'YOUR_SITE_ID'
+        cloudId: 'YOUR_CLOUD_ID', // e.g. nuxt.matomo.cloud
       }
     }
   }
@@ -40,7 +41,7 @@ export default defineNuxtConfig({
     scripts: {
       registry: {
         matomoAnalytics: {
-          siteId: 'YOUR_SITE_ID',
+          cloudId: 'YOUR_CLOUD_ID', // e.g. nuxt.matomo.cloud
         }
       }
     }
@@ -61,8 +62,8 @@ export default defineNuxtConfig({
       scripts: {
         matomoAnalytics: {
           // .env
-          // NUXT_PUBLIC_SCRIPTS_MATOMO_ANALYTICS_SITE_ID=<your-id>
-          siteId: '', // NUXT_PUBLIC_SCRIPTS_MATOMO_ANALYTICS_SITE_ID
+          // NUXT_PUBLIC_SCRIPTS_MATOMO_ANALYTICS_CLOUD_ID=<your-id>
+          cloudId: '', // NUXT_PUBLIC_SCRIPTS_MATOMO_ANALYTICS_CLOUD_ID
         },
       },
     },
@@ -76,16 +77,52 @@ export default defineNuxtConfig({
 
 The `useScriptMatomoAnalytics` composable lets you have fine-grain control over when and how Matomo Analytics is loaded on your site.
 
+
+```ts
+const matomoAnalytics = useScriptMatomoAnalytics({
+  cloudId: 'YOUR_CLOUD_ID', // e.g. nuxt.matomo.cloud
+})
+```
+
+By default, a `siteId` of `1` is used and the page is not tracked. You can enable tracking by setting `trackPageView` to `true`.
+
+```ts
+const matomoAnalytics = useScriptMatomoAnalytics({
+  cloudId: 'YOUR_CLOUD_ID', // e.g. nuxt.matomo.cloud
+  trackPageView: true,
+  siteId: 2,
+})
+```
+
+If you'd like more control over the tracking, for example to set a custom dimension, you can send events using the `proxy` object.
+
+```ts
+const { proxy } = useScriptMatomoAnalytics({
+  cloudId: 'YOUR_CLOUD_ID', // e.g. nuxt.matomo.cloud
+})
+
+// set custom dimension
+proxy._paq.push(['setCustomDimension', 1, 'value'])
+// send page event
+proxy._paq.push(['trackPageView'])
+```
+
+Please see the [Config Schema](#config-schema) for all available options.
+
+### Using Matomo Self-Hosted
+
+For self-hosted Matomo, set `matomoUrl` to customize tracking, you may need to set the `trackerUrl` if you've customized this.
+
 ```ts
 const matomoAnalytics = useScriptMatomoAnalytics({
-  matomoUrl: 'YOUR_MATOMO_URL',
-  siteId: 'YOUR_SITE_ID'
+  // e.g. https://your-url.com/tracker.js & https://your-url.com//matomo.php both exists
+  matomoUrl: 'https://your-url.com',
 })
 ```
 
 ### Using Matomo Whitelabel
 
-For Matomo Whitelabel, set trackerUrl and scriptInput.src to customize tracking.
+For Matomo Whitelabel, set `trackerUrl` and `scriptInput.src` to customize tracking.
 
 ```ts
 const matomoAnalytics = useScriptMatomoAnalytics({
@@ -113,8 +150,8 @@ You must provide the options when setting up the script for the first time.
 ```ts
 // matomoUrl and site are required
 export const MatomoAnalyticsOptions = object({
-  matomoUrl: string(),
-  siteId: string(),
+  matomoUrl: optional(string()),
+  siteId: optional(string()),
   trackerUrl: optional(string()),
   trackPageView: optional(boolean()),
   enableLinkTracking: optional(boolean()),

docs/package.json

@@ -13,7 +13,7 @@
     "@iconify-json/ph": "^1.2.0",
     "@iconify-json/simple-icons": "^1.2.4",
     "@nuxt/content": "^2.13.2",
-    "@nuxt/fonts": "^0.8.0",
+    "@nuxt/fonts": "^0.9.2",
     "@nuxt/image": "^1.8.0",
     "@nuxt/scripts": "workspace:*",
     "@nuxt/ui-pro": "^1.4.3",
@@ -22,6 +22,6 @@
     "@vueuse/core": "^11.1.0",
     "@vueuse/nuxt": "^11.1.0",
     "nuxt-scripts-devtools": "workspace:*",
-    "shiki": "^1.18.0"
+    "shiki": "^1.20.0"
   }
 }

package.json

@@ -1,7 +1,7 @@
 {
   "name": "@nuxt/scripts",
   "type": "module",
-  "version": "0.9.3",
+  "version": "0.9.4",
   "packageManager": "[email protected]",
   "description": "Load third-party scripts with better performance, privacy and DX in Nuxt Apps.",
   "author": {
@@ -65,10 +65,10 @@
     ]
   },
   "dependencies": {
-    "@nuxt/devtools-kit": "^1.5.0",
-    "@nuxt/devtools-ui-kit": "^1.5.0",
+    "@nuxt/devtools-kit": "^1.5.1",
+    "@nuxt/devtools-ui-kit": "^1.5.1",
     "@nuxt/kit": "^3.13.2",
-    "@types/google.maps": "^3.58.0",
+    "@types/google.maps": "^3.58.1",
     "@types/stripe-v3": "^3.1.33",
     "@types/vimeo__player": "^2.18.3",
     "@types/youtube": "^0.1.0",
@@ -84,36 +84,36 @@
     "pathe": "^1.1.2",
     "pkg-types": "^1.2.0",
     "semver": "^7.6.3",
-    "shiki": "1.18.0",
+    "shiki": "1.20.0",
     "sirv": "^2.0.4",
     "std-env": "^3.7.0",
     "third-party-capital": "3.0.0",
     "ufo": "^1.5.4",
-    "unimport": "^3.12.0",
+    "unimport": "^3.13.0",
     "unplugin": "^1.14.1",
     "unstorage": "^1.12.0",
     "valibot": "^0.42.1"
   },
   "devDependencies": {
-    "@nuxt/devtools-ui-kit": "^1.5.0",
+    "@nuxt/devtools-ui-kit": "^1.5.1",
     "@nuxt/eslint-config": "^0.5.7",
     "@nuxt/module-builder": "^0.8.4",
     "@nuxt/test-utils": "3.14.2",
     "@types/semver": "^7.5.8",
-    "@typescript-eslint/typescript-estree": "^8.6.0",
+    "@typescript-eslint/typescript-estree": "^8.7.0",
     "@unhead/schema": "1.11.6",
     "acorn-loose": "^8.4.0",
     "bumpp": "^9.5.2",
     "changelogen": "^0.5.7",
-    "eslint": "9.11.0",
+    "eslint": "9.11.1",
     "eslint-plugin-n": "^17.10.3",
     "knitwork": "^1.1.0",
     "nuxt": "^3.13.2",
     "nuxt-scripts-devtools": "workspace:*",
     "playwright-core": "^1.47.2",
     "typescript": "^5.6.2",
     "vitest": "^2.1.1",
-    "vue": "^3.5.8",
+    "vue": "^3.5.9",
     "vue-router": "^4.4.5"
   },
   "resolutions": {
@@ -127,7 +127,7 @@
     "nuxt": "^3.13.2",
     "nuxt-scripts-devtools": "workspace:*",
     "unhead": "1.11.6",
-    "vue": "^3.5.8",
+    "vue": "^3.5.9",
     "vue-router": "^4.4.5"
   }
 }

playground/pages/third-parties/matomo-analytics/default.vue

@@ -0,0 +1,28 @@
+<script lang="ts" setup>
+import { useHead } from '#imports'
+
+useHead({
+  title: 'Matomo Analytics',
+  script: [
+    {
+      innerHTML: `var _paq = window._paq = window._paq || [];
+  /* tracker methods like "setCustomDimension" should be called before "trackPageView" */
+  _paq.push(['trackPageView']);
+  _paq.push(['enableLinkTracking']);
+  (function() {
+    var u="https://nuxt.matomo.cloud/";
+    _paq.push(['setTrackerUrl', u+'matomo.php']);
+    _paq.push(['setSiteId', '1']);
+    var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
+    g.async=true; g.src='https://cdn.matomo.cloud/nuxt.matomo.cloud/matomo.js'; s.parentNode.insertBefore(g,s);
+  })();`,
+    },
+  ],
+})
+</script>
+
+<template>
+  <div>
+    matomo default
+  </div>
+</template>

playground/pages/third-parties/matomo-analytics.vue → playground/pages/third-parties/matomo-analytics/nuxt-scripts.vue

@@ -7,7 +7,7 @@ useHead({
 
 // composables return the underlying api as a proxy object and the script state
 const { status, proxy } = useScriptMatomoAnalytics({
-  matomoUrl: 'https://nuxt-scripts-demo.matomo.cloud',
+  cloudId: 'nuxt.matomo.cloud',
   siteId: '1',
 })