├── .editorconfig ├── .github └── workflows │ ├── autofix.yml │ └── unit-tests.yml ├── .gitignore ├── .npmrc ├── .nuxtrc ├── CHANGELOG.md ├── README.md ├── build.config.ts ├── client ├── .nuxtrc ├── app.vue ├── nuxt.config.ts ├── package.json └── pages │ └── index.vue ├── eslint.config.js ├── package.json ├── playground ├── app.vue ├── nuxt.config.ts └── package.json ├── renovate.json ├── rpc-types.ts ├── src ├── devtools.ts ├── module.ts └── runtime │ └── plugin.ts ├── test ├── basic.test.ts └── fixtures │ └── basic │ ├── app.vue │ ├── nuxt.config.ts │ └── package.json ├── tsconfig.json ├── vue-mess-detector-nuxt-devtools.png └── yarn.lock /.editorconfig: -------------------------------------------------------------------------------- 1 | root = true 2 | 3 | [*] 4 | indent_size = 2 5 | indent_style = space 6 | end_of_line = lf 7 | charset = utf-8 8 | trim_trailing_whitespace = true 9 | insert_final_newline = true 10 | 11 | [*.md] 12 | trim_trailing_whitespace = false 13 | -------------------------------------------------------------------------------- /.github/workflows/autofix.yml: -------------------------------------------------------------------------------- 1 | name: autofix.ci 2 | on: 3 | pull_request: 4 | push: 5 | branches: [main] 6 | permissions: 7 | contents: read 8 | 9 | jobs: 10 | autofix: 11 | runs-on: ubuntu-latest 12 | steps: 13 | - uses: actions/checkout@v4 14 | - uses: actions/setup-node@v4 15 | with: 16 | node-version: '20' 17 | cache: yarn 18 | 19 | - name: Install dependencies 20 | run: yarn install 21 | - name: Run yarn lint --fix 22 | run: yarn lint:fix 23 | 24 | - uses: autofix-ci/action@ff86a557419858bb967097bfc916833f5647fa8c 25 | -------------------------------------------------------------------------------- /.github/workflows/unit-tests.yml: -------------------------------------------------------------------------------- 1 | name: Run Unit Tests 2 | 3 | on: 4 | push: 5 | branches: [main] 6 | pull_request: 7 | branches: [main] 8 | 9 | jobs: 10 | test: 11 | runs-on: ubuntu-latest 12 | 13 | steps: 14 | - uses: actions/checkout@v4 15 | 16 | - name: Use Node.js 17 | uses: actions/setup-node@v4 18 | with: 19 | node-version: "20" 20 | cache: yarn 21 | 22 | - name: Install dependencies 23 | run: yarn install 24 | 25 | - name: Prepare 26 | run: yarn dev:prepare 27 | 28 | - name: Run tests 29 | run: yarn test 30 | -------------------------------------------------------------------------------- /.gitignore: -------------------------------------------------------------------------------- 1 | # Dependencies 2 | node_modules 3 | 4 | # Logs 5 | *.log* 6 | 7 | # Temp directories 8 | .temp 9 | .tmp 10 | .cache 11 | 12 | # Yarn 13 | **/.yarn/cache 14 | **/.yarn/*state* 15 | 16 | # Generated dirs 17 | dist 18 | 19 | # Nuxt 20 | .nuxt 21 | .output 22 | .vercel_build_output 23 | .build-* 24 | .env 25 | .netlify 26 | 27 | # Env 28 | .env 29 | 30 | # Testing 31 | reports 32 | coverage 33 | *.lcov 34 | .nyc_output 35 | 36 | # VSCode 37 | .vscode/* 38 | !.vscode/settings.json 39 | !.vscode/tasks.json 40 | !.vscode/launch.json 41 | !.vscode/extensions.json 42 | !.vscode/*.code-snippets 43 | 44 | # Intellij idea 45 | *.iml 46 | .idea 47 | 48 | # OSX 49 | .DS_Store 50 | .AppleDouble 51 | .LSOverride 52 | .AppleDB 53 | .AppleDesktop 54 | Network Trash Folder 55 | Temporary Items 56 | .apdisk 57 | -------------------------------------------------------------------------------- /.npmrc: -------------------------------------------------------------------------------- 1 | shamefully-hoist=true 2 | strict-peer-dependencies=false 3 | -------------------------------------------------------------------------------- /.nuxtrc: -------------------------------------------------------------------------------- 1 | imports.autoImport=false 2 | typescript.includeWorkspace=true 3 | -------------------------------------------------------------------------------- /CHANGELOG.md: -------------------------------------------------------------------------------- 1 | # Changelog 2 | 3 | 4 | ## v0.1.2 5 | 6 | [compare changes](https://github.com/rrd108/vue-mess-detector-nuxt-devtools/compare/v0.1.1...v0.1.2) 7 | 8 | ### 🏡 Chore 9 | 10 | - **release:** V0.1.1 ([07cb9fe](https://github.com/rrd108/vue-mess-detector-nuxt-devtools/commit/07cb9fe)) 11 | 12 | ### ❤️ Contributors 13 | 14 | - Rrd108 ([@rrd108](http://github.com/rrd108)) 15 | 16 | ## v0.1.1 17 | 18 | [compare changes](https://github.com/rrd108/vue-mess-detector-nuxt-devtools/compare/v0.1.0...v0.1.1) 19 | 20 | ### 🏡 Chore 21 | 22 | - **release:** V0.0.1 ([4e2f25a](https://github.com/rrd108/vue-mess-detector-nuxt-devtools/commit/4e2f25a)) 23 | 24 | ### ❤️ Contributors 25 | 26 | - Rrd108 ([@rrd108](http://github.com/rrd108)) 27 | 28 | ## v0.0.1 29 | 30 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | # Vue Mess Detector Nuxt Devtools Plugin 2 | 3 | [![npm version][npm-version-src]][npm-version-href] 4 | [![npm downloads][npm-downloads-src]][npm-downloads-href] 5 | [![License][license-src]][license-href] 6 | [![Nuxt][nuxt-src]][nuxt-href] 7 | 8 | Vue Mess Detector module integrated with the [Nuxt Devtools](https://github.com/nuxt/devtools). 9 | 10 | [Vue Mess Detector](https://vue-mess-detector.webmania.cc/) is a comprehensive code analysis and quality assessment tool. 11 | That provides actionable insights into code health, helping developers identify and resolve potential issues in Vue.js and Nuxt.js projects. 12 | 13 | This package contains only the devtools integration; Vue Mess Detector is added as a dependency. 14 | 15 | ## Features 16 | 17 | - 😻 NPM and JSR Support 18 | - 🤖 PNPM, Bun, Yarn and NPM 19 | - 🔩 Focus on Important Rules 20 | - 🚀 Run the analyzer directly from dev tools 21 | 22 | ## Quick Setup 23 | 24 | 1. Add `vue-mess-detector-nuxt-devtools` dependency to your project 25 | 26 | ```bash 27 | # Using pnpm 28 | pnpm add -D vue-mess-detector-nuxt-devtools 29 | 30 | # Using yarn 31 | yarn add --dev vue-mess-detector-nuxt-devtools 32 | 33 | # Using npm 34 | npm install --save-dev vue-mess-detector-nuxt-devtools 35 | ``` 36 | 37 | 2. Add `vue-mess-detector-nuxt-devtools` to the `modules` section of `nuxt.config.ts` 38 | 39 | ```js 40 | export default defineNuxtConfig({ 41 | modules: ["vue-mess-detector-nuxt-devtools"], 42 | }); 43 | ``` 44 | 45 | That's it! You can now use Vue Mess Detector in your Nuxt app ✨ 46 | 47 | ## Screenshot 48 | 49 | ![Vue Mess Detector Nuxt Devtools](vue-mess-detector-nuxt-devtools.png) 50 | 51 | ## Development 52 | 53 | ```bash 54 | # Install dependencies 55 | npm install 56 | 57 | # Generate type stubs 58 | npm run dev:prepare 59 | 60 | # Develop with playground, with devtools client ui 61 | npm run dev 62 | 63 | # Develop with playground, with bundled client ui 64 | npm run play:prod 65 | 66 | # Run ESLint 67 | npm run lint 68 | 69 | # Run Vitest 70 | npm run test 71 | npm run test:watch 72 | 73 | # Release new version 74 | npm run release 75 | ``` 76 | 77 | 78 | 79 | [npm-version-src]: https://img.shields.io/npm/v/vue-mess-detector-nuxt-devtools/latest.svg?style=flat&colorA=18181B&colorB=28CF8D 80 | [npm-version-href]: https://npmjs.com/package/vue-mess-detector-nuxt-devtools 81 | [npm-downloads-src]: https://img.shields.io/npm/dm/vue-mess-detector-nuxt-devtools.svg?style=flat&colorA=18181B&colorB=28CF8D 82 | [npm-downloads-href]: https://npmjs.com/package/vue-mess-detector-nuxt-devtools 83 | [license-src]: https://img.shields.io/npm/l/vue-mess-detector-nuxt-devtools.svg?style=flat&colorA=18181B&colorB=28CF8D 84 | [license-href]: https://npmjs.com/package/vue-mess-detector-nuxt-devtools 85 | [nuxt-src]: https://img.shields.io/badge/Nuxt-18181B?logo=nuxt.js 86 | [nuxt-href]: https://nuxt.com 87 | -------------------------------------------------------------------------------- /build.config.ts: -------------------------------------------------------------------------------- 1 | import { defineBuildConfig } from 'unbuild' 2 | 3 | export default defineBuildConfig({ 4 | externals: [ 5 | 'vue-mess-detector', 6 | 'yargs', 7 | '@vue/compiler-sfc', 8 | 'cliui', 9 | 'escalade/sync', 10 | 'yargs-parser', 11 | 'y18n', 12 | ], 13 | rollup: { 14 | emitCJS: true, 15 | inlineDependencies: true, 16 | output: { 17 | exports: 'named', 18 | }, 19 | plugins: [ 20 | { 21 | name: 'node-globals', 22 | resolveId: (source: string) => source === 'node:path' ? source : null, 23 | load: (id: string) => { 24 | if (id === 'node:path') { 25 | return ` 26 | import path from 'path' 27 | export default path 28 | export const __dirname = path.dirname(new URL(import.meta.url).pathname) 29 | export const __filename = new URL(import.meta.url).pathname 30 | ` 31 | } 32 | }, 33 | }, 34 | ], 35 | }, 36 | declaration: true, 37 | failOnWarn: false, 38 | }) 39 | -------------------------------------------------------------------------------- /client/.nuxtrc: -------------------------------------------------------------------------------- 1 | imports.autoImport=true 2 | -------------------------------------------------------------------------------- /client/app.vue: -------------------------------------------------------------------------------- 1 | 6 | -------------------------------------------------------------------------------- /client/nuxt.config.ts: -------------------------------------------------------------------------------- 1 | import { resolve } from 'pathe' 2 | 3 | export default defineNuxtConfig({ 4 | ssr: false, 5 | 6 | modules: [ 7 | '@nuxt/devtools-ui-kit', 8 | ], 9 | 10 | nitro: { 11 | output: { 12 | publicDir: resolve(__dirname, '../dist/client'), 13 | }, 14 | }, 15 | 16 | app: { 17 | baseURL: '/__vue-mess-detector', 18 | }, 19 | 20 | vite: { 21 | server: { 22 | hmr: { 23 | // Instead of go through proxy, we directly connect real port of the client app 24 | clientPort: +(process.env.PORT || 3300), 25 | }, 26 | }, 27 | }, 28 | 29 | devtools: { 30 | enabled: true, 31 | }, 32 | 33 | compatibilityDate: '2024-08-21', 34 | }) 35 | -------------------------------------------------------------------------------- /client/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "private": true, 3 | "name": "vue-mess-detector-client" 4 | } 5 | -------------------------------------------------------------------------------- /client/pages/index.vue: -------------------------------------------------------------------------------- 1 | 2 | 3 | 53 | 54 | 114 | 115 | 186 | -------------------------------------------------------------------------------- /eslint.config.js: -------------------------------------------------------------------------------- 1 | // @ts-check 2 | import { createConfigForNuxt } from '@nuxt/eslint-config/flat' 3 | 4 | // Run `npx @eslint/config-inspector` to inspect the resolved config interactively 5 | export default createConfigForNuxt({ 6 | features: { 7 | // Rules for module authors 8 | tooling: true, 9 | // Rules for formatting 10 | stylistic: true, 11 | }, 12 | dirs: { 13 | root: [ 14 | '', 15 | 'playground', 16 | 'client', 17 | ], 18 | }, 19 | }) 20 | .append( 21 | // Add the rule configuration here 22 | { 23 | rules: { 24 | 'no-console': 'off', 25 | 'no-debugger': 'off', 26 | 'semi': ['error', 'never'], 27 | 'eqeqeq': 'off', 28 | 'eol-last': ['error', 'always'], 29 | 'comma-dangle': ['error', 'always-multiline'], 'vue/multi-word-component-names': ['error', { 30 | ignores: ['index'], 31 | }], 32 | 'vue/no-v-html': 'off', 33 | }, 34 | }, 35 | ) 36 | -------------------------------------------------------------------------------- /package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "vue-mess-detector-nuxt-devtools", 3 | "version": "0.1.2", 4 | "description": "Vue Mess Detector for Nuxt Devtools", 5 | "repository": "https://github.com/rrd108/vue-mess-detector-nuxt-devtools", 6 | "license": "MIT", 7 | "type": "module", 8 | "exports": { 9 | ".": { 10 | "types": "./dist/types.d.ts", 11 | "import": "./dist/module.mjs", 12 | "require": "./dist/module.cjs" 13 | } 14 | }, 15 | "main": "./dist/module.cjs", 16 | "types": "./dist/types.d.ts", 17 | "files": [ 18 | "dist" 19 | ], 20 | "scripts": { 21 | "prepack": "nuxt-module-build build", 22 | "dev": "nuxi dev playground", 23 | "dev:build": "nuxi build playground", 24 | "dev:prepare": "nuxt-module-build build --stub && nuxt-module-build prepare && nuxi prepare playground", 25 | "release:patch": "yarn lint && yarn test && yarn prepack && changelogen --release --patch && yarn publish && git push --follow-tags", 26 | "release:minor": "yarn lint && yarn test && yarn prepack && changelogen --release --minor && yarn publish && git push --follow-tags", 27 | "lint": "eslint .", 28 | "lint:fix": "eslint . --fix", 29 | "test": "vitest run", 30 | "test:watch": "vitest watch" 31 | }, 32 | "dependencies": { 33 | "@nuxt/devtools-kit": "^1.4.1", 34 | "@nuxt/kit": "^3.13.1", 35 | "sirv": "^2.0.4", 36 | "vue-mess-detector": "latest" 37 | }, 38 | "devDependencies": { 39 | "@iconify-json/carbon": "^1.2.1", 40 | "@nuxt/devtools": "^1.4.1", 41 | "@nuxt/devtools-ui-kit": "^1.4.1", 42 | "@nuxt/eslint-config": "^0.5.5", 43 | "@nuxt/module-builder": "^0.8.3", 44 | "@nuxt/schema": "^3.13.1", 45 | "@nuxt/test-utils": "^3.14.1", 46 | "changelogen": "^0.5.5", 47 | "eslint": "^9.9.1", 48 | "nuxt": "^3.12.4", 49 | "vitest": "^2.0.5" 50 | }, 51 | "packageManager": "yarn@1.22.21+sha1.1959a18351b811cdeedbd484a8f86c3cc3bbaf72" 52 | } 53 | -------------------------------------------------------------------------------- /playground/app.vue: -------------------------------------------------------------------------------- 1 | 6 | 7 | 9 | -------------------------------------------------------------------------------- /playground/nuxt.config.ts: -------------------------------------------------------------------------------- 1 | import { resolve } from 'node:path' 2 | import { defineNuxtModule } from '@nuxt/kit' 3 | import { startSubprocess } from '@nuxt/devtools-kit' 4 | 5 | export default defineNuxtConfig({ 6 | devtools: { 7 | enabled: true, 8 | }, 9 | 10 | modules: [ 11 | /** 12 | * Vue Mess Detector 13 | */ 14 | '../src/module', 15 | /** 16 | * Start a sub Nuxt Server for developing the client 17 | * 18 | * The terminal output can be found in the Terminals tab of the devtools. 19 | */ 20 | defineNuxtModule({ 21 | setup(_, nuxt) { 22 | if (!nuxt.options.dev) { 23 | return 24 | } 25 | 26 | const _process = startSubprocess( 27 | { 28 | command: 'npx', 29 | args: ['nuxi', 'dev', '--port', '3300'], 30 | cwd: resolve(__dirname, '../client'), 31 | }, 32 | { 33 | id: 'vue-mess-detector:client', 34 | name: 'Vue Mess Detector Client Dev', 35 | }, 36 | ) 37 | }, 38 | }), 39 | ], 40 | 41 | vueMessDetector: {}, 42 | 43 | compatibilityDate: '2024-08-21', 44 | }) 45 | -------------------------------------------------------------------------------- /playground/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "private": true, 3 | "name": "vue-mess-detector-nuxt-devtools-playground", 4 | "type": "module", 5 | "scripts": { 6 | "dev": "nuxi dev", 7 | "build": "nuxi build", 8 | "generate": "nuxi generate" 9 | }, 10 | "dependencies": { 11 | "nuxt": "^3.13.2" 12 | } 13 | } 14 | -------------------------------------------------------------------------------- /renovate.json: -------------------------------------------------------------------------------- 1 | { 2 | "$schema": "https://docs.renovatebot.com/renovate-schema.json", 3 | "extends": [ 4 | "config:recommended" 5 | ] 6 | } 7 | -------------------------------------------------------------------------------- /rpc-types.ts: -------------------------------------------------------------------------------- 1 | export interface AnalysisResult { 2 | output: { info: string }[] 3 | reportOutput: Record> 4 | codeHealthOutput: { info: string }[] 5 | } 6 | 7 | export interface ServerFunctions { 8 | getResults: () => Promise 9 | } 10 | 11 | export interface ClientFunctions { 12 | _doNothing: () => void 13 | } 14 | -------------------------------------------------------------------------------- /src/devtools.ts: -------------------------------------------------------------------------------- 1 | import { existsSync } from 'node:fs' 2 | import type { Nuxt } from 'nuxt/schema' 3 | import type { Resolver } from '@nuxt/kit' 4 | import { addCustomTab } from '@nuxt/devtools-kit' 5 | 6 | const DEVTOOLS_UI_ROUTE = '/__vue-mess-detector' 7 | const DEVTOOLS_UI_LOCAL_PORT = 3300 8 | 9 | export function setupDevToolsUI(nuxt: Nuxt, resolver: Resolver) { 10 | const clientPath = resolver.resolve('./client') 11 | const isProductionBuild = existsSync(clientPath) 12 | 13 | // Serve production-built client (used when package is published) 14 | if (isProductionBuild) { 15 | nuxt.hook('vite:serverCreated', async (server) => { 16 | const sirv = await import('sirv').then(r => r.default || r) 17 | server.middlewares.use( 18 | DEVTOOLS_UI_ROUTE, 19 | sirv(clientPath, { dev: true, single: true }), 20 | ) 21 | }) 22 | } 23 | 24 | if (!isProductionBuild) { // In local development, start a separate Nuxt Server and proxy to serve the client 25 | nuxt.hook('vite:extendConfig', (config) => { 26 | config.server = config.server || {} 27 | config.server.proxy = config.server.proxy || {} 28 | config.server.proxy[DEVTOOLS_UI_ROUTE] = { 29 | target: 'http://localhost:' + DEVTOOLS_UI_LOCAL_PORT + DEVTOOLS_UI_ROUTE, 30 | changeOrigin: true, 31 | followRedirects: true, 32 | rewrite: path => path.replace(DEVTOOLS_UI_ROUTE, ''), 33 | } 34 | }) 35 | } 36 | 37 | addCustomTab({ 38 | name: 'vue-mess-detector', 39 | title: 'Vue Mess Detector', 40 | icon: 'tabler:analyze', 41 | view: { 42 | type: 'iframe', 43 | src: DEVTOOLS_UI_ROUTE, 44 | }, 45 | }) 46 | } 47 | -------------------------------------------------------------------------------- /src/module.ts: -------------------------------------------------------------------------------- 1 | import { defineNuxtModule, addPlugin, createResolver } from '@nuxt/kit' 2 | import { extendServerRpc, onDevToolsInitialized } from '@nuxt/devtools-kit' 3 | import { analyze, FLAT_RULES } from 'vue-mess-detector' 4 | import type { ClientFunctions, ServerFunctions } from '../rpc-types' 5 | import { setupDevToolsUI } from './devtools' 6 | 7 | export interface ModuleOptions { 8 | devtools: boolean 9 | } 10 | 11 | export default defineNuxtModule({ 12 | meta: { 13 | name: 'vue-mess-detector', 14 | configKey: 'vueMessDetector', 15 | }, 16 | 17 | defaults: { 18 | devtools: true, 19 | }, 20 | 21 | setup(options, nuxt) { 22 | const resolver = createResolver(import.meta.url) 23 | 24 | addPlugin(resolver.resolve('./runtime/plugin')) 25 | 26 | if (options.devtools) { 27 | setupDevToolsUI(nuxt, resolver) 28 | } 29 | 30 | onDevToolsInitialized(async () => { 31 | extendServerRpc('vueMessDetector', { 32 | getResults: async () => { 33 | const results = await analyze({ dir: './', apply: FLAT_RULES }) 34 | return results 35 | }, 36 | }) 37 | }) 38 | }, 39 | }) 40 | -------------------------------------------------------------------------------- /src/runtime/plugin.ts: -------------------------------------------------------------------------------- 1 | import { defineNuxtPlugin } from '#app' 2 | 3 | export default defineNuxtPlugin((_nuxtApp) => { 4 | }) 5 | -------------------------------------------------------------------------------- /test/basic.test.ts: -------------------------------------------------------------------------------- 1 | import { describe, it, expect, vi } from 'vitest' 2 | import { addCustomTab } from '@nuxt/devtools-kit' 3 | import type { Nuxt } from '@nuxt/schema' 4 | import type { Resolver } from '@nuxt/kit' 5 | import { setupDevToolsUI } from '../src/devtools' 6 | 7 | vi.mock('@nuxt/devtools-kit', () => ({ 8 | addCustomTab: vi.fn(), 9 | })) 10 | 11 | vi.mock('vue-mess-detector', () => ({ 12 | analyze: vi.fn(), 13 | FLAT_RULES: {}, 14 | })) 15 | 16 | describe('setupDevToolsUI', () => { 17 | it('calls addCustomTab with correct parameters', () => { 18 | const mockNuxt = { 19 | hook: vi.fn(), 20 | } as unknown as Nuxt 21 | const mockResolver = { 22 | resolve: vi.fn().mockReturnValue('./client'), 23 | } as unknown as Resolver 24 | 25 | setupDevToolsUI(mockNuxt, mockResolver) 26 | 27 | expect(addCustomTab).toHaveBeenCalledWith({ 28 | name: 'vue-mess-detector', 29 | title: 'Vue Mess Detector', 30 | icon: 'tabler:analyze', 31 | view: { 32 | type: 'iframe', 33 | src: '/__vue-mess-detector', 34 | }, 35 | }) 36 | }) 37 | 38 | it('sets up production middleware when client path exists', () => { 39 | vi.mock('node:fs', () => ({ 40 | existsSync: () => true, 41 | })) 42 | 43 | const mockNuxt = { 44 | hook: vi.fn(), 45 | } as unknown as Nuxt 46 | const mockResolver = { 47 | resolve: vi.fn().mockReturnValue('./client'), 48 | } as unknown as Resolver 49 | 50 | setupDevToolsUI(mockNuxt, mockResolver) 51 | 52 | expect(mockNuxt.hook).toHaveBeenCalledWith('vite:extendConfig', expect.any(Function)) 53 | }) 54 | 55 | it('sets up development proxy when client path does not exist', () => { 56 | vi.mock('node:fs', () => ({ 57 | existsSync: () => false, 58 | })) 59 | 60 | const mockNuxt = { 61 | hook: vi.fn(), 62 | } as unknown as Nuxt 63 | const mockResolver = { 64 | resolve: vi.fn().mockReturnValue('./client'), 65 | } as unknown as Resolver 66 | 67 | setupDevToolsUI(mockNuxt, mockResolver) 68 | 69 | expect(mockNuxt.hook).toHaveBeenCalledWith('vite:extendConfig', expect.any(Function)) 70 | }) 71 | }) 72 | -------------------------------------------------------------------------------- /test/fixtures/basic/app.vue: -------------------------------------------------------------------------------- 1 | 4 | 5 | 7 | -------------------------------------------------------------------------------- /test/fixtures/basic/nuxt.config.ts: -------------------------------------------------------------------------------- 1 | import vueMessDetector from '../../../src/module' 2 | 3 | export default defineNuxtConfig({ 4 | devtools: { 5 | enabled: true, 6 | }, 7 | modules: [vueMessDetector], 8 | }) 9 | -------------------------------------------------------------------------------- /test/fixtures/basic/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "private": true, 3 | "name": "basic", 4 | "type": "module" 5 | } 6 | -------------------------------------------------------------------------------- /tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "./.nuxt/tsconfig.json", 3 | "exclude": [ 4 | "dist", 5 | "node_modules", 6 | "playground", 7 | ] 8 | } 9 | -------------------------------------------------------------------------------- /vue-mess-detector-nuxt-devtools.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/rrd108/vue-mess-detector-nuxt-devtools/b30877597a138ef1a4b34195d63d6d03da4a46d6/vue-mess-detector-nuxt-devtools.png --------------------------------------------------------------------------------