Stylelint Unknown Rules in Sage 10 (declaration-colon-newline-after, string-quotes)

sage
,
1

I’m having an issue integrating stylelint into my Sage 10 theme by following the guide.

When I run yarn lint:css

I get these errors:

resources/styles/app.css
  1:1  ✖  Unknown rule declaration-colon-newline-after  declaration-colon-newline-after
  1:1  ✖  Unknown rule string-quotes                    string-quotes
  1:1  ✖  Unknown rule value-list-comma-newline-after   value-list-comma-newline-after

Here’s my package.json:

{
  "name": "sage",
  "private": true,
  "browserslist": [
    "extends @roots/browserslist-config"
  ],
  "engines": {
    "node": ">=20.0.0"
  },
  "type": "module",
  "scripts": {
    "dev": "bud dev",
    "build": "bud build",
    "lint": "yarn lint:js && yarn lint:css",
    "lint:js": "eslint resources/scripts",
    "lint:css": "stylelint \"resources/**/*.{css,scss,vue}\""
  },
  "devDependencies": {
    "@roots/bud": "6.20.0",
    "@roots/bud-eslint": "^6.24.0",
    "@roots/bud-prettier": "^6.24.0",
    "@roots/bud-stylelint": "^6.24.0",
    "@roots/bud-tailwindcss": "6.20.0",
    "@roots/eslint-config": "^6.24.0",
    "@roots/sage": "6.20.0",
    "daisyui": "^4.12.22"
  }
}

app.css

@tailwind base;
@tailwind components;
@tailwind utilities;

What am I doing wrong? Any guidance would be greatly appreciated. Thank you in advance! :blush:

2

First try getting all of your bud.js packages using the same version. Right now you’re mixing 6.20.0 and 6.24.0:

yarn bud upgrade
3

thanks Ben. it worked