Support new configuration styles

README.md

@@ -1,19 +1,23 @@
 # Nuxt Fathom
 
-Implement Fathom analytics in your Nuxt app.
+Implement [Fathom Analytics](https://usefathom.com/) in your Nuxt app.
 
-## Quick Install
+## Installation
 
 ```
-$ npm i @yabhq/nuxt-fathom
+$ npm i -D @yabhq/nuxt-fathom
 ```
 
-Configure the module in your **nuxt.config.js**:
+## Configuration
+
+Configure the module in your `nuxt.config.js`:
 
 ```JavaScript
-modules: [
-    // ....
-    ['@yabhq/nuxt-fathom', {
+export default {
+    buildModules: [
+        '@yabhq/nuxt-fathom'
+    ],
+    fathom: {
         siteId: 'XXXXXX', // required
 
         // Advanced configuration
@@ -40,7 +44,32 @@ modules: [
 
         spa: 'auto',
         // optional, defaults to 'auto'
-    }],
-    // ....
+    },
 ]
 ```
+
+### Runtime Config
+
+You can also use the [Runtime Config](https://nuxtjs.org/guide/runtime-config):
+
+```JavaScript
+export default {
+    // ...
+    publicRuntimeConfig: {
+        fathom: {
+            siteId: process.env.FATHOM_SITE_ID,
+        }
+    }
+}
+```
+
+### TypeScript
+
+You can benefit from types inside your `nuxt.config.ts` by adding the module to your
+`tsconfig.json`:
+
+```json
+    "types": [
+      "@yabhq/nuxt-fathom"
+    ]
+```

lib/module.js

@@ -1,32 +1,24 @@
 const { resolve } = require('path')
 
-function nuxtFathom(options) {
-  if ( typeof options.auto !== 'boolean' ) {
-    options.auto = true
-  }
-
-  if ( typeof options.canonical !== 'boolean' ) {
-    options.canonical = true
-  }
-
-  if ( !options.excludedDomains ) {
-    options.excludedDomains = ''
-  }
-
-  if ( typeof options.honorDoNotTrack !== 'boolean' ) {
-    options.honorDoNotTrack = false
-  }
-
-  if ( !options.includedDomains ) {
-    options.includedDomains = ''
-  }
-
-  if ( !options.spa ) {
-    options.spa = 'auto'
-  }
-
-  if ( !options.scriptSrc ) {
-    options.scriptSrc = 'https://cdn.usefathom.com/tracker.js'
+function nuxtFathom(moduleOptions) {
+  const { nuxt } = this
+
+  const defaultOptions = {
+    auto: true,
+    canonical: true,
+    excludedDomains: '',
+    honorDoNotTrack: false,
+    includedDomains: '',
+    spa: 'auto',
+    scriptSrc: 'https://cdn.usefathom.com/tracker.js'
+  }
+
+  // Combine options
+  const options = {
+    ...defaultOptions,
+    ...nuxt.options.fathom,
+    ...moduleOptions,
+    ...(nuxt.options.publicRuntimeConfig && nuxt.options.publicRuntimeConfig.fathom)
   }
 
   // Disable if siteId missing

package.json

@@ -1,8 +1,9 @@
 {
   "name": "@yabhq/nuxt-fathom",
-  "version": "2.0.0",
+  "version": "2.1.0",
   "description": "NuxtJS module for Fathom Analytics",
   "main": "lib/module.js",
+  "types": "types/index.d.ts",
   "directories": {
     "lib": "lib"
   },

types/index.d.ts

@@ -0,0 +1,48 @@
+declare module '@nuxt/types' {
+  interface NuxtOptions {
+    fathom?: {
+      /**
+       * ID of your site as assigned by Fathom Analytics. Optional here, but you have to set it
+       * either by module options or runtime config.
+       */
+      siteId?: string
+
+      /**
+       * Automatically track page views. Optional, defaults to `true`.
+       */
+      auto?: boolean
+
+      /**
+       * Use the canonical URL (if any) instead of the current URL. Optional, defaults to `true`.
+       */
+      canonical?: boolean
+
+      /**
+       * Blacklist one or multiple domains (separate by comma) to exclude them from tracking.
+       * Optional.
+       */
+      excludedDomains?: string
+
+      /**
+       * Fathom does not track anything personal or identifiable. If you want to honor DNT regardless,
+       * you can. Optional, defaults to `false`.
+       */
+      honorDoNotTrack?: boolean
+
+      /**
+       * Whitelist one or multiple domains (separate by comma) to only track there. Optional.
+       */
+      includedDomains?: string
+
+      /**
+       * Set the navigation mode. Optional, defaults to `'auto'`.
+       */
+      spa?: 'auto' | 'history' | 'hash'
+
+      /**
+       * Support custom domains. Optional, defaults to `'https://cdn.usefathom.com/tracker.js'`.
+       */
+      scriptSrc?: string
+    }
+  }
+}