@cooperco/nuxt-layer-base 1.1.0 → 1.1.1

package/README.md

@@ -174,16 +174,45 @@ import withNuxt from './.nuxt/eslint.config.mjs'
 
 export default withNuxt({
   rules: {
-    // Stylistic
-    '@stylistic/comma-dangle': ['error', 'never'],
-
-    // TypeScript
-    '@typescript-eslint/no-unused-vars': ['error', { caughtErrorsIgnorePattern: '^_' }],
-
-    // Vue template
-    'vue/html-closing-bracket-newline': ['error', { multiline: 'never', selfClosingTag: { multiline: 'never' } }],
-    'vue/html-closing-bracket-spacing': ['error', { selfClosingTag: 'never' }],
-    'vue/html-indent': ['error', 2, { baseIndent: 0 }]
+    /* Stylistic */
+    '@stylistic/comma-dangle': [
+      'error',
+      'only-multiline'
+    ],
+    '@stylistic/no-tabs': [
+      'error',
+      { allowIndentationTabs: true }
+    ],
+
+    /* TS */
+    '@typescript-eslint/no-unused-vars': [
+      'error',
+      { caughtErrorsIgnorePattern: '^_' }
+    ],
+
+    /* Vue */
+    'vue/html-closing-bracket-newline': [
+      'error',
+      { multiline: 'never', selfClosingTag: { multiline: 'never' } }
+    ],
+    'vue/html-closing-bracket-spacing': [
+      'error',
+      { selfClosingTag: 'never' }
+    ],
+    'vue/html-indent': [
+      'error', 'tab',
+      { baseIndent: 0 }
+    ],
+    'vue/multi-word-component-names': ['error', {
+      ignores: []
+    }],
+    'vue/component-name-in-template-casing': [
+      'error',
+      'kebab-case',
+      { registeredComponentsOnly: false, ignores: [] }
+    ],
+    'vue/component-options-name-casing': ['error', 'kebab-case'],
+    'vue/component-definition-name-casing': ['error', 'kebab-case']
   }
 })
 ```
@@ -202,62 +231,62 @@ export default withNuxt({
 Notes
 - The base layer enables stylistic mode via Nuxt (`eslint.config.stylistic: true`).
 - Do not use Prettier alongside stylistic rules; remove Prettier configs/plugins from your app to avoid conflicts.
+- Tabs are allowed for indentation (including in Vue templates). The `no-tabs` rule is enabled but permits indentation tabs.
 
 What this ESLint config enforces (in plain English)
 
 - Base: It starts from Nuxt’s generated, project‑aware flat config (via `@nuxt/eslint`), then turns on stylistic mode for consistent formatting in JS/TS/Vue files.
 - This layer adds a few focused rules to keep things consistent and practical:
-  - `@stylistic/comma-dangle: 'never'` — Disallow trailing commas in arrays/objects.
-    - Bad:
-      ```js
-      const user = {
-        id: 1,
-        name: 'Ada',
-      }
-      ```
-    - Good:
+  - `@stylistic/comma-dangle: 'only-multiline'` — Allow trailing commas only when the list spans multiple lines; disallow them on single‑line lists.
+    - Good (multiline, trailing comma ok):
       ```js
       const user = {
-        id: 1,
-        name: 'Ada'
+      	id: 1,
+      	name: 'Ada',
       }
       ```
+    - Good (single‑line, no trailing comma): `const arr = [1, 2, 3]`
+  - `@stylistic/no-tabs` with `{ allowIndentationTabs: true }` — Tabs are allowed for indentation but tabs elsewhere are flagged.
   - `@typescript-eslint/no-unused-vars` with `{ caughtErrorsIgnorePattern: '^_' }` — Flag unused variables, but allow a try/catch parameter that starts with `_` when you don’t use it.
     - Good (explicitly ignored):
       ```ts
       try {
-        risky()
+      	risky()
       }
       catch (_err) {
-        // intentionally ignored
+      	// intentionally ignored
       }
       ```
   - `vue/html-closing-bracket-newline: { multiline: 'never', selfClosingTag: { multiline: 'never' } }` — Don’t put a newline before a closing bracket, even for multi‑line attribute lists.
     - Bad:
       ```vue
-      <MyComp
-        a="1"
-        b="2"
+      <my-comp
+      	a="1"
+      	b="2"
       />
       ```
     - Good:
       ```vue
-      <MyComp
-        a="1"
-        b="2" />
+      <my-comp
+      	a="1"
+      	b="2" />
       ```
   - `vue/html-closing-bracket-spacing: { selfClosingTag: 'never' }` — No space before a self‑closing `/>`.
-    - Bad: `<MyComp />`
-    - Good: `<MyComp/>`
-  - `vue/html-indent: [2, { baseIndent: 0 }]` — Two‑space indentation in templates.
+    - Bad: `<my-comp />`
+    - Good: `<my-comp/>`
+  - `vue/html-indent: ['tab', { baseIndent: 0 }]` — Use tabs for indentation in Vue templates.
     - Example:
       ```vue
       <template>
-        <div>
-          <span>Text</span>
-        </div>
+      	<div>
+      		<span>Text</span>
+      	</div>
       </template>
       ```
+  - `vue/multi-word-component-names` — Enforce multi‑word component names (no single generic names like `Header` conflicts). Configure ignores if needed.
+  - `vue/component-name-in-template-casing: 'kebab-case'` — In templates, component tags must be kebab‑case (e.g., `<my-widget/>`, not `<MyWidget/>`).
+  - `vue/component-options-name-casing: 'kebab-case'` — In SFC component options, the `name` should be kebab‑case.
+  - `vue/component-definition-name-casing: 'kebab-case'` — For component definitions in script, enforce kebab‑case names.
 
 ### TypeScript in consumer apps
 

package/eslint.config.mjs

@@ -32,7 +32,17 @@ export default withNuxt({
     'vue/html-indent': [
       'error', 'tab',
       { baseIndent: 0 }
-    ]
+    ],
+    'vue/multi-word-component-names': ['error', {
+      ignores: []
+    }],
+    'vue/component-name-in-template-casing': [
+      'error',
+      'kebab-case',
+      { registeredComponentsOnly: false, ignores: [] }
+    ],
+    'vue/component-options-name-casing': ['error', 'kebab-case'],
+    'vue/component-definition-name-casing': ['error', 'kebab-case']
   }
 })
 

package/nuxt.config.ts

@@ -30,6 +30,10 @@ export default defineNuxtConfig({
     config: {
       stylistic: true
     }
+  },
+
+  i18n: {
+    defaultLocale: 'en'
   }
 
 })

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@cooperco/nuxt-layer-base",
-  "version": "1.1.0",
+  "version": "1.1.1",
   "type": "module",
   "main": "./nuxt.config.ts",
   "scripts": {
@@ -22,13 +22,13 @@
   "author": "cooperco",
   "license": "MIT",
   "dependencies": {
-    "@nuxt/eslint": "^1.10.0",
     "@nuxtjs/i18n": "^10.2.1",
-    "nuxt": "^4.2.1"
+    "nuxt": "^4.2.2"
   },
   "devDependencies": {
+    "@nuxt/eslint": "^1.10.0",
     "@nuxt/test-utils": "^3.20.1",
-    "eslint": "^9.39.1",
+    "eslint": "^9.39.2",
     "vue-tsc": "^3.1.4"
   }
 }