Skip to content

vue/multi-word-component-names: 'off' not respected on pages when nuxt srcDir is changed. #225

@StefanCardnell

Description

@StefanCardnell

Reproduction:

- Operating System: `Linux`
- Node Version:     `v18.5.0`
- Nuxt Version:     `3.0.0-rc.5`
- Package Manager:  `[email protected]`
- Builder:          `vite`
- User Config:      `ssr`, `srcDir`, `typescript`, `app`, `vite`, `modules`, `css`
- Runtime Modules:  `@pinia/[email protected]`, `@nuxtjs/[email protected]`
- Build Modules:    `-`
------------------------------
  1. Go to nuxt.config.ts and change srcDir to src/
  2. Move all folders, including layout and pages, under the src/ directory. But keep eslintrc.json in the root directory still.

I face issues that my layout/page components are not multiword components:

image

I can see this is because the ESLint rule is very particular about the pages/layout directory being at the top level:

https://github.com/nuxt/eslint-config/blob/d4250a6e4d57835d7c9d3c017ab82a1f55383c98/packages/eslint-config/index.js#L130

It's fixable with the following override in eslintrc.json, but feels dirty:

    overrides: [
        {
            files: ['src/pages/**/*.vue', 'src/layouts/*.vue'],
            rules: {
                'vue/multi-word-component-names': 'off',
            },
        },
    ],

Edit: I suppose the issue disappears when moving eslintrc.json in to the src/ directory however obviously this means the top level directory won't have eslintrules. So for the moment I've defined two eslintrc.json files - I don't know if this is the intended way of doing this:

/eslintrc.json:

{
    "env": {
        "browser": true,
        "es2021": true,
        "node": true
    },
    "extends": [
        "eslint:recommended",
        "plugin:@typescript-eslint/recommended",
        "plugin:prettier/recommended"
    ],
    "parserOptions": {
        "ecmaVersion": "latest",
        "parser": "@typescript-eslint/parser",
        "sourceType": "module"
    },
    "plugins": ["@typescript-eslint"]
}

/src/eslintrc.json:

{
    "extends": [
        "eslint:recommended",
        "plugin:vue/essential",
        "plugin:@typescript-eslint/recommended",
        "@nuxtjs/eslint-config-typescript",
        "plugin:prettier/recommended"
    ],
    "plugins": ["vue", "@typescript-eslint"]
}

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions