Nuxt Workspace

A Nuxt module integrating workspace paths into Nuxt config of monorepo

[!NOTE] This project is in beta. Use under your own risk, but feel free to test, make pull request and improve this project.

Features

• Seamless integration of #workspace in any path of the Nuxt config
• Customizable placeholder option to suit your needs
• Ability to selectively exclude specific configurations from being replaced

Why

Nuxt originally provides a typescript.includeWorkspace config, but it only includes all workspace files. This can cause interference between different packages in a monorepo, preventing the completion of typecheck.

After using this nuxt-workspace module, you can use #workspace/*.d.ts in the typescript.tsConfig.include configuration to customize the workspace pattern you want to include and also you can also use it in all other Nuxt configuration areas.

Setup

# Using pnpm
pnpm add -D nuxt-workspace

# Using yarn
yarn add --dev nuxt-workspace

# Using npm
npm install --save-dev nuxt-workspace

Usage

After adding nuxt-workspace to your nuxt config modules, you can use #workspace as path in your nuxt.config.ts. It will auto replace the placeholder with the workspaceDir.

export default defineNuxtConfig({
  modules: [
    'nuxt-workspace'
  ],
  typescript: {
    tsConfig: {
      include: [
        '#workspace/*.d.ts'
      ],
    },
  },
  components: [
    { path: '#workspace/packages/foo/components' }
  ]
})

Configuration

You can configure Nuxt Workspace with the workspace property in your nuxt.config file.

placeholder

• Type: string
• Default: #workspace

Allows you to customize the placeholder used for workspace path substitution.

export default defineNuxtConfig({
  workspace: {
    placeholder: '@my-workspace'
  },
  // Now you can use to `@my-workspace` in your config
  typescript: {
    tsConfig: {
      include: [
        '@my-workspace/*.d.ts'
      ]
    }
  }
})

ignoreObjectPaths

• Type: string[]
• Default: []

Allows you to selectively exclude specific configurations from being replaced.

export default defineNuxtConfig({
  workspace: {
    ignoreObjectPaths: [
      'app.head.title'
    ]
  },
  app: {
    head: {
      title: '#workspace' // this config will not been replaced
    }
  }
})

Ignore object paths with Object or Array

export default defineNuxtConfig({
  workspace: {
    ignoreObjectPaths: [
      'foo.someArray[1]',
      'foo.someObject',
    ]
  },
  foo: {
    someArray: [
      '#workspace/foo',
      '#workspace/bar', // ignore replacement
    ],

    // ignore replacement for all configs in this object
    someObject: {
      'foo': '#workspace',
      'bar': '#workspace',
    }
  },
})

Development

# Install dependencies
npm install

# Generate type stubs
npm run dev:prepare

# Develop with the playground
npm run dev

# Build the playground
npm run dev:build

# Run ESLint
npm run lint

# Run Vitest
npm run test
npm run test:watch

# Release new version
npm run release