integrate Stylelint (#1374)

Author: mockdeep

.circleci/config.yml

@@ -71,7 +71,15 @@ jobs:
 
       - run:
           name: ESLint
-          command: pnpm lint
+          command: pnpm eslint
+
+      - run:
+          name: Stylelint
+          command: pnpm stylelint
+
+      - run:
+          name: Verify Stylelint Autogen
+          command: bundle exec exe/stylelint_autogen
 
       - run:
           name: Rubocop

.rubocop_todo.yml

@@ -1,6 +1,6 @@
 # This configuration was generated by
 # `rubocop --auto-gen-config --auto-gen-only-exclude --exclude-limit 400`
-# on 2026-02-02 14:59:16 UTC using RuboCop version 1.84.0.
+# on 2026-02-14 01:48:12 UTC using RuboCop version 1.84.2.
 # The point is for the user to remove these configuration records
 # one by one as the offenses are removed from the code base.
 # Note that changes in the inspected code, or installation of new
@@ -73,7 +73,7 @@ Metrics/PerceivedComplexity:
 # Offense count: 3
 # Configuration parameters: Mode, AllowedMethods, AllowedPatterns, AllowBangMethods, WaywardPredicates.
 # AllowedMethods: call
-# WaywardPredicates: nonzero?
+# WaywardPredicates: infinite?, nonzero?
 Naming/PredicateMethod:
   Exclude:
     - 'app/utils/sample_story.rb'
@@ -252,7 +252,7 @@ Rails/Validation:
   Exclude:
     - 'app/models/story.rb'
 
-# Offense count: 16
+# Offense count: 20
 # This cop supports unsafe autocorrection (--autocorrect-all).
 # Configuration parameters: EnforcedStyle.
 # SupportedStyles: brackets, fetch
@@ -266,6 +266,7 @@ Style/HashLookupMethod:
     - 'app/controllers/feeds_controller.rb'
     - 'app/controllers/stories_controller.rb'
     - 'config/application.rb'
+    - 'exe/stylelint_autogen'
     - 'spec/repositories/feed_repository_spec.rb'
     - 'spec/repositories/story_repository_spec.rb'
     - 'spec/repositories/user_repository_spec.rb'
@@ -293,6 +294,14 @@ Style/StaticClass:
     - 'app/repositories/story_repository.rb'
     - 'app/repositories/user_repository.rb'
 
+# Offense count: 1
+# This cop supports safe autocorrection (--autocorrect).
+# Configuration parameters: EnforcedStyle.
+# SupportedStyles: single_quotes, double_quotes
+Style/StringLiteralsInInterpolation:
+  Exclude:
+    - 'exe/stylelint_autogen'
+
 # Offense count: 1
 Style/TopLevelMethodDefinition:
   Exclude:

.stylelint_todo.yml

@@ -0,0 +1,61 @@
+# This configuration was generated by `exe/stylelint_autogen`
+# on 2026-02-14 01:44:58 UTC.
+# The point is for the user to remove these configuration records
+# one by one as the offenses are removed from the code base.
+
+overrides:
+
+  # Offense count: 5
+  - rules: { 'alpha-value-notation': null }
+    files:
+    - app/assets/stylesheets/application.css
+
+  # Offense count: 5
+  - rules: { 'color-function-alias-notation': null }
+    files:
+    - app/assets/stylesheets/application.css
+
+  # Offense count: 5
+  - rules: { 'color-function-notation': null }
+    files:
+    - app/assets/stylesheets/application.css
+
+  # Offense count: 1
+  - rules: { 'color-hex-length': null }
+    files:
+    - app/assets/stylesheets/application.css
+
+  # Offense count: 2
+  - rules: { 'comment-empty-line-before': null }
+    files:
+    - app/assets/stylesheets/application.css
+
+  # Offense count: 1
+  - rules: { 'font-family-name-quotes': null }
+    files:
+    - app/assets/stylesheets/application.css
+
+  # Offense count: 15
+  - rules: { 'length-zero-no-unit': null }
+    files:
+    - app/assets/stylesheets/application.css
+
+  # Offense count: 3
+  - rules: { 'media-feature-range-notation': null }
+    files:
+    - app/assets/stylesheets/application.css
+
+  # Offense count: 64
+  - rules: { 'order/properties-order': null }
+    files:
+    - app/assets/stylesheets/application.css
+
+  # Offense count: 19
+  - rules: { 'property-no-vendor-prefix': null }
+    files:
+    - app/assets/stylesheets/application.css
+
+  # Offense count: 2
+  - rules: { 'selector-class-pattern': null }
+    files:
+    - app/assets/stylesheets/application.css

exe/stylelint_autogen

@@ -0,0 +1,44 @@
+#!/usr/bin/env ruby
+# frozen_string_literal: true
+
+require "active_support/all"
+require "stringio"
+
+TODO_FILE_PATH = "./.stylelint_todo.yml"
+HEADING = <<~COMMENTS.freeze
+  # This configuration was generated by `exe/stylelint_autogen`
+  # on #{Time.now.utc}.
+  # The point is for the user to remove these configuration records
+  # one by one as the offenses are removed from the code base.
+COMMENTS
+
+File.write(TODO_FILE_PATH, "{}")
+json =
+  `pnpm --silent stylelint --quiet-deprecation-warnings --formatter json 2>&1`
+results = JSON.parse(json)
+
+by_rule =
+  results.each_with_object({}) do |result, hash|
+    result.fetch("warnings").each do |warning|
+      hash[warning.fetch("rule")] ||= []
+      hash[warning.fetch("rule")] << result.fetch("source")
+    end
+  end
+
+output = StringIO.new
+output.puts(HEADING)
+output.puts
+output.puts("overrides:")
+
+by_rule.sort.each do |rule, file_paths|
+  output.puts
+  output.puts("  # Offense count: #{file_paths.length}")
+  output.puts("  - rules: { '#{rule}': null }")
+  output.puts("    files:")
+
+  file_paths.uniq.sort.each do |file_path|
+    output.puts("    - #{file_path.sub("#{Dir.pwd}/", "")}")
+  end
+end
+
+File.write(TODO_FILE_PATH, output.string)

package.json

@@ -1,12 +1,17 @@
 {
   "private": true,
   "scripts": {
-    "lint": "eslint app/assets/javascripts/ spec/javascript/spec/"
+    "eslint": "eslint app/assets/javascripts/ spec/javascript/spec/",
+    "stylelint": "stylelint 'app/assets/stylesheets/**/*.css'"
   },
   "devDependencies": {
     "@eslint/js": "^9.21.0",
     "eslint": "^9.21.0",
-    "globals": "^16.0.0"
+    "globals": "^16.0.0",
+    "stylelint": "^17.3.0",
+    "stylelint-config-recess-order": "^7.6.1",
+    "stylelint-config-standard": "^40.0.0",
+    "stylelint-selector-bem-pattern": "^4.0.1"
   },
   "packageManager": "pnpm@10.4.1"
 }