feat: module improvements

.eslintignore

@@ -1,11 +1,9 @@
-# Common
 node_modules
-dist
 .nuxt
+*.log
+cache/
+lib/
+types/
+.DS_Store
 coverage
-
-# Plugin
-lib/plugin.js
-
-# Typings
-/**/*.d.ts
+sw.*

.eslintrc.js

@@ -1,16 +1,7 @@
 module.exports = {
   root: true,
-  parserOptions: {
-    parser: 'babel-eslint',
-    sourceType: 'module'
-  },
   extends: [
-    '@nuxtjs'
-  ],
-  rules: {
-    'vue/singleline-html-element-content-newline': 0,
-    'vue/multiline-html-element-content-newline': 0,
-    'vue/html-self-closing': 0,
-    'vue/no-v-html': 0
-  }
+    '@nuxtjs',
+    '@nuxtjs/eslint-config-typescript'
+  ]
 }

.github/workflows/ci.yml

@@ -15,7 +15,7 @@ jobs:
     strategy:
       matrix:
         os: [ubuntu-latest, macos-latest, windows-latest]
-        node: [10, 12]
+        node: [12]
 
     steps:
       - uses: actions/setup-node@v2

.gitignore

@@ -8,3 +8,6 @@ node_modules
 coverage
 dist
 sw.*
+
+lib
+types

CHANGELOG.md

@@ -2,6 +2,13 @@
 
 All notable changes to this project will be documented in this file. See [standard-version](https://github.com/conventional-changelog/standard-version) for commit guidelines.
 
+### [0.1.10](https://github.com/nuxt-community/strapi-module/compare/v0.1.9...v0.1.10) (2021-01-08)
+
+
+### Features
+
+* added typescript support and updated docs accordingly ([#94](https://github.com/nuxt-community/strapi-module/issues/94)) ([64f1927](https://github.com/nuxt-community/strapi-module/commit/64f1927c2a412d0b8c0c8920431b1dbe30f35f2b))
+
 ### [0.1.9](https://github.com/nuxt-community/strapi-module/compare/v0.1.8...v0.1.9) (2020-12-18)
 
 

docs/content/en/hooks.md

@@ -13,12 +13,14 @@ You can register an `error` hook to display a toast for example:
 
 ```js{}[plugins/strapi.js]
 export default ({ $strapi, app }) => {
-  $strapi.hook('error', (e) => {
-    app.$toast.error(e.message)
+  $strapi.hook('error', (error) => {
+    app.$toast.error(error.message)
   })
 }
 ```
 
+You can also get the original error from Strapi api with `error.original`.
+
 ### `userUpdated`
 
 You can register an `userUpdated` hook to force refetch inside components:

docs/content/en/options.md

@@ -55,3 +55,59 @@ export default {
 > Check out the [Strapi documentation](https://strapi.io/documentation/v3.x/content-api/api-endpoints.html#endpoints) on API endpoints.
 
 See more in [Usage](/usage#entities).
+
+## `key`
+
+<badge>v0.2.0+</badge>
+
+- Type: `String`
+- Default: `'strapi_jwt'`
+
+Key used for the cookie name as well as localStorage/sessionStorage key.
+
+```js{}[nuxt.config.js]
+export default {
+  strapi: {
+    key: 'userJwt'
+  }
+}
+```
+## `expires`
+
+<badge>v0.2.0+</badge>
+
+- Type: `String` or `Number` or `'session'`
+- Default: `'session'`
+
+When `expires === 'session'`, the [sessionStorage](https://developer.mozilla.org/en-US/docs/Web/API/Window/sessionStorage) will be used to act like the cookie.
+
+Otherwise, if the value is a string, it will be parsed using [ms](https://github.com/vercel/ms), ex: expires: '7d'
+
+A number can also be provided as milliseconds, ex: expires: 7 * 24 * 3600 * 1000
+
+```js{}[nuxt.config.js]
+export default {
+  strapi: {
+    expires: '31d'
+  }
+}
+```
+
+### `cookie`
+
+<badge>v0.2.0+</badge>
+
+- Type: `Object`
+- Default: `{}`
+
+Options to forward to the [cookie#options](https://github.com/jshttp/cookie#options-1) module, the `expires` property will be overwritten.
+
+```js{}[nuxt.config.js]
+export default {
+  strapi: {
+    cookie: {
+      sameSite: 'lax'
+    }
+  }
+}
+```

docs/content/en/typescript.md

@@ -81,75 +81,7 @@ export default Vue.extend({
 </script>
 ```
 
-## Known issues
-
-There are some known issues with the current implementation of TypeScript in the library,
-so we have listed some workarounds.
-
-### Entity shortcuts
-
-The current TypeScript implementation doesn't support entity shortcuts: your code may work,
-but it will throw type checking errors. This is why we made the `entity` parameter needed in
-every method which involves a query.
-
-You can however define the entities available to your Vue methods with
-[string literal types](https://www.typescriptlang.org/docs/handbook/literal-types.html#string-literal-types)
-as described below.
-
-```vue
-<script lang="ts">
-import Vue from 'vue'
-import { Context } from '@nuxt/types'
-
-interface BlogPost {
-  title: string;
-  description: string;
-}
-
-type Entities = 'posts' | 'projects'
-
-export default Vue.extend({
-  async asyncData (ctx: Context) {
-    const posts = await ctx.$strapi.find<BlogPost[], Entities>(
-      'posts'
-    )
-
-    return {
-      posts
-    }
-  }
-})
-</script>
-```
-
-### Query params
-
-Some query methods won't be accepted by the compiler if you define generics as in `$strapi.find<BlogPost[]>`
-(e.g.: the array methods described [here](/strapi#findentity-params)).
-
-You can get around this issue by doing something like below.
-
-```vue
-<script lang="ts">
-import Vue from 'vue'
-
-interface BlogPost {
-  title: string;
-  description: string;
-}
-
-export default Vue.extend({
-  async asyncData (ctx: Context) {
-    const posts: BlogPost[] = await this.$strapi.find(
-      'posts'
-    )
-
-    return {
-      posts
-    }
-  }
-})
-</script>
-```
-
-> You can always declare the return type by assigning a type to the variable instead of the method.
+<alert type="info">
+Entity shortcuts will not be correctly picked up by the Typescript compiler,
+we suggest not to use them if you're using Typescript.
+</alert>

example/nuxt.config.ts

@@ -0,0 +1,8 @@
+import type { NuxtConfig } from '@nuxt/types'
+
+export default <NuxtConfig>{
+  buildModules: ['@nuxt/typescript-build'],
+  modules: [
+    '../src/module.ts'
+  ]
+}

example/tsconfig.json

@@ -0,0 +1,34 @@
+{
+  "compilerOptions": {
+    "target": "ES2018",
+    "module": "ESNext",
+    "moduleResolution": "Node",
+    "lib": [
+      "ESNext",
+      "ESNext.AsyncIterable",
+      "DOM"
+    ],
+    "esModuleInterop": true,
+    "allowJs": true,
+    "sourceMap": true,
+    "strict": true,
+    "noEmit": true,
+    "baseUrl": ".",
+    "paths": {
+      "~/*": [
+        "./*"
+      ],
+      "@/*": [
+        "./*"
+      ]
+    },
+    "types": [
+      "@types/node",
+      "@nuxt/types",
+      "../types"
+    ]
+  },
+  "exclude": [
+    "node_modules"
+  ]
+}

jest.config.js

@@ -1,17 +1,8 @@
 module.exports = {
-  testEnvironment: 'node',
-  collectCoverage: true,
-  collectCoverageFrom: [
-    'lib/**/*.js',
-    '!lib/plugin.js'
-  ],
+  preset: '@nuxt/test-utils',
   moduleNameMapper: {
-    '^~/(.*)$': '<rootDir>/lib/$1',
-    '^~~$': '<rootDir>',
-    '^@@$': '<rootDir>',
-    '^@/(.*)$': '<rootDir>/lib/$1'
-  },
-  transform: {
-    '^.+\\.js$': 'babel-jest'
+    '~image': '<rootDir>/src/runtime/index.ts',
+    '~image/(.*)': '<rootDir>/src/runtime/$1',
+    '~/(.*)': '<rootDir>/$1'
   }
 }