Merge branch 'fix/v1.0.2'

Author: shunnNet

CHANGELOG.md

@@ -1,4 +1,19 @@
 
+## v1.0.2
+[compare changes](https://github.com/shunnNet/nuxt-msw/compare/v1.0.1...v1.0.2)
+
+### 🩹 Fixes
+- Lost type infos when `msw.enable: false`([e2bc95b](https://github.com/shunnNet/nuxt-msw/commit/e2bc95b))
+  - Related to: [issues/2](https://github.com/shunnNet/nuxt-msw/issues/2). 
+  - In previous versions, when `enable: false`, the auto imports provided by `nuxt-msw` would lose type information. This could hinder type checking and potentially cause unnecessary confusion for developers. Therefore, in this update, the auto imports will be retained even when `enable: false` to avoid these issues.
+
+### 🏡 Chore
+- Move `ofetch` and `unimport` to dev deps ([0eab2b8](https://github.com/shunnNet/nuxt-msw/commit/0eab2b8))
+
+### ❤️ Contributors
+
+- Net <wendell20904102@gmail.com>
+
 ## v1.0.1
 
 ## doc

README.md

@@ -1,18 +1,18 @@
 # nuxt-msw
-<!-- [![npm version][npm-version-src]][npm-version-href]
-[![npm downloads][npm-downloads-src]][npm-downloads-href]
-[![License][license-src]][license-href]
-[![Nuxt][nuxt-src]][nuxt-href] -->
+[![npm version](https://img.shields.io/npm/v/@crazydos/nuxt-msw.svg?style=flat&colorA=18181B&colorB=28CF8D)](https://www.npmjs.com/package/@crazydos/nuxt-msw)
+[![npm downloads](https://img.shields.io/npm/dm/@crazydos/nuxt-msw.svg?style=flat&colorA=18181B&colorB=28CF8D)](https://www.npmjs.com/package/@crazydos/nuxt-msw)
+[![License](https://img.shields.io/github/license/nuxt/nuxt.svg?style=flat&colorA=18181B&colorB=28CF8D)](https://github.com/shunnNet/nuxt-msw/blob/main/LICENSE)
 
 `nuxt-msw` integrates [MSW (Mock Service Worker)](https://mswjs.io/) into a Nuxt project, allowing you to use it for API mocking during development. Most of the code can be directly shared with test mocks. 
 
 
-- [✨ &nbsp;Release Notes](/CHANGELOG.md)
+[✨ Release Notes](/CHANGELOG.md)
 <!-- - [🏀 Online playground](https://stackblitz.com/github/your-org/nuxt-msw?file=playground%2Fapp.vue) -->
 <!-- - [📖 &nbsp;Documentation](https://example.com) -->
 
 - [nuxt-msw](#nuxt-msw)
   - [Features](#features)
+  - [Online Playground](#online-playground)
   - [Migrate: `0.x` -\> `1.x` users](#migrate-0x---1x-users)
   - [Setup](#setup)
   - [Usage](#usage)
@@ -38,6 +38,12 @@
 - ⛰ Intercept both server-side and client-side request, including `$fetch`, `useFetch` and any other api requests.
 - 🥧 Support Nuxt layer.
 
+## Online Playground
+You can try out the functionality of `nuxt-msw` online through the following website.
+
+[![Play in Codesandbox](https://codesandbox.io/static/img/play-codesandbox.svg)](https://codesandbox.io/p/devbox/3jdr8d?embed=1)
+<!-- [![Play in Stackblitz](https://developer.stackblitz.com/img/open_in_stackblitz.svg)](https://stackblitz.com/edit/nuxt-starter-ex6po1?file=app.vue) -->
+
 ## Migrate: `0.x` -> `1.x` users
 Thank you to all the users of version 0.x. I believe you won’t need to put in too much effort to upgrade to version 1.x.
 
@@ -216,27 +222,38 @@ export default defineNuxtConfig({
   msw: {
     /**
      * Whether to enable the module. Default to `true`
+     * 
+     * This is useful when you need to enable or disable msw based on the environment.
+     * 
+     * When `enable: false`, the msw worker and server will not try to intercept requests, but keeps auto import composables for type checking.
+     * 
+     * @default true
+     * 
+     * @example
+     * {
+     *   enable: process.env.TEST === 'true'
+     * }
      */
-    enable: true,
+    enable: true, // default: true
      /**
       * Path to the nuxt-msw runtime folder that include worker and server files.
-      * default: `~/msw`
+      * @default "~/msw"
       */ 
     folderPath: "~/msw"
-    
     /**
      * Should include nuxt layers msw settings or not
-     * default: true
+     * @default true
      */
     includeLayer?: boolean
-    
     /**
      *
      * Enable unit test mode. default: false
      *
-     * In unit test mode, the module run <folderPath>/unit.{ts,js,mjs,cjs} file which run in nodejs environment.
+     * When this mode is enabled, you can use `setupNuxtMswServer` to start the msw server in a unit test environment (which is a Node.js environment).
      *
-     * Which means msw server will be used in this mode.
+     *  When enable: false, this mode is inactive.
+     * 
+     * @default true
      */
     testUtils?: boolean
   },
@@ -369,7 +386,8 @@ await setupNuxtMswServer({
 })
 ```
 
-> [!NOTE] `baseURL` here is just a valid domain, it is not necessary to match nuxt server address. But if you run a real server and want msw fallback to there, you need to set baseURL to the real server address.  
+> [!NOTE] 
+> `baseURL` here is just a valid domain, it is not necessary to match nuxt server address. But if you run a real server and want msw fallback to there, you need to set baseURL to the real server address.  
 
 
 #### E2E Tests

package.json

@@ -1,6 +1,6 @@
 {
   "name": "@crazydos/nuxt-msw",
-  "version": "1.0.1",
+  "version": "1.0.2",
   "description": "Nuxt module integration for MSW (Mock Service Worker)",
   "author": {
     "name": "shunnNet",
@@ -42,9 +42,7 @@
     "test:pl": "playwright test"
   },
   "dependencies": {
-    "@nuxt/kit": "^3.11.2",
-    "ofetch": "^1.3.4",
-    "unimport": "^3.7.1"
+    "@nuxt/kit": "^3.11.2"
   },
   "peerDependencies": {
     "msw": "^2.x"
@@ -67,7 +65,9 @@
     "typescript": "latest",
     "vitest": "^1.6.0",
     "vitest-environment-nuxt": "^1.0.1",
-    "vue-tsc": "^2.0.16"
+    "vue-tsc": "^2.0.16",
+    "ofetch": "^1.3.4",
+    "unimport": "^3.7.1"
   },
   "msw": {
     "workerDirectory": [

playground/layers/test-layer/msw/server.ts

@@ -4,17 +4,17 @@ export default defineNuxtMswServerOption(() => {
   const baseURL = useRuntimeConfig().public.msw?.baseURL
   const handlers = [
     // Intercept "GET https://example.com/user" requests...
-    // http.get(baseURL + '/api/user', () => {
-    //   // ...and respond to them using this JSON response.
-    //   return HttpResponse.json({
-    //     id: 'Mock03 layer',
-    //     firstName: 'Mock layer',
-    //     lastName: 'User layer',
-    //   })
-    // }),
+    http.get(baseURL + '/api/user', () => {
+      // ...and respond to them using this JSON response.
+      return HttpResponse.json({
+        id: 'Mock03 layer',
+        firstName: 'Mock layer',
+        lastName: 'User layer',
+      })
+    }),
   ]
   return {
-    // baseURL,
+    baseURL,
     handlers,
     serverOptions: {
       onUnhandledRequest: 'bypass',

playground/msw/server.ts

@@ -3,14 +3,14 @@ import { http, HttpResponse } from 'msw'
 const baseURL = useRuntimeConfig().public.msw?.baseURL
 const handlers = [
   // Intercept "GET https://example.com/user" requests...
-  // http.get(baseURL + '/api/user', () => {
-  //   // ...and respond to them using this JSON response.
-  //   return HttpResponse.json({
-  //     id: 'Mock03',
-  //     firstName: 'Mock2',
-  //     lastName: 'User',
-  //   })
-  // }),
+  http.get(baseURL + '/api/user', () => {
+    // ...and respond to them using this JSON response.
+    return HttpResponse.json({
+      id: 'Mock03',
+      firstName: 'Mock2',
+      lastName: 'User',
+    })
+  }),
 ]
 export default defineNuxtMswServerOption({
   baseURL,

playwright.config.ts

@@ -5,7 +5,7 @@ import type { ConfigOptions } from '@nuxt/test-utils/playwright'
 export default defineConfig<ConfigOptions>({
   use: {
     nuxt: {
-      // rootDir: fileURLToPath(new URL('./test/fixtures/basic', import.meta.url)),
+      rootDir: fileURLToPath(new URL('./test/fixtures/basic', import.meta.url)),
     },
     headless: false,
     channel: 'chrome',