Skip to content
This repository was archived by the owner on Dec 10, 2024. It is now read-only.

Commit 5f2c94d

Browse files
feat: reapply historic changes after sync with origin (#2)
* fix: solves issue with css custom properties on .less files * v2.13.0 * updates readme * renamed recommedned rules * v2.14.0 * v2.15.0 * removes eliminateGlobals * removes console logs * v2.16.0 * addresses bug with ampersand in the right of selectors * addresses bug with ampersand in the right of selectors 2 * v2.16.2 * add CODEOWNERS * chore: minor changes * feat: update ci * chore: add nvmrc --------- Co-authored-by: Fauricio Valencia <fauricio.valencia@pager.com>
1 parent 9827d36 commit 5f2c94d

13 files changed

+100
-137
lines changed

.github/CODEOWNERS

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
* @pagerinc/ragnarok-frontend

.github/auto_assign.yml

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
addAssignees: author

.github/renovate.json5

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
{
2+
extends: ['github>pagerinc/web-renovate-config'],
3+
}

.github/semantic.yml

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
titleAndCommits: true
2+
allowMergeCommits: true
3+
allowRevertCommits: true
Lines changed: 10 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,10 @@
1+
name: 'Auto Assign'
2+
on:
3+
pull_request:
4+
types: [opened, ready_for_review]
5+
jobs:
6+
add-reviews:
7+
runs-on: ubuntu-latest
8+
steps:
9+
- name: Auto Assign Action
10+
uses: kentaro-m/auto-assign-action@v1.2.5

.github/workflows/ci.yml

Lines changed: 50 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,50 @@
1+
name: Continuous Integration
2+
on:
3+
push:
4+
branches:
5+
- master
6+
- beta
7+
pull_request:
8+
branches:
9+
- master
10+
- '**/*'
11+
env:
12+
NPM_TOKEN: ${{ secrets.NPM_TOKEN }}
13+
PAGER_JFROG_NPM_TOKEN: ${{ secrets.PAGER_JFROG_NPM_TOKEN }}
14+
HUSKY_SKIP_INSTALL: 'true'
15+
jobs:
16+
ci:
17+
name: 🏗 CI
18+
runs-on: ubuntu-latest
19+
if: "!contains(github.event.head_commit.message, '[no github actions]')"
20+
steps:
21+
- name: ⬇️ Checkout Repo
22+
uses: actions/checkout@v3
23+
with:
24+
token: ${{ secrets.GH_TOKEN }}
25+
fetch-depth: 0 # Required for Chromatic to work
26+
- name: ⎔ Setup Node.js
27+
uses: actions/setup-node@v3
28+
with:
29+
node-version-file: '.nvmrc'
30+
- name: 📥 Install dependencies
31+
run: yarn install --frozen-lockfile
32+
- name: 🔬 Lint
33+
run: yarn lint
34+
- name: 🧪 Test
35+
run: yarn test
36+
- name: ⚙ Build
37+
run: npm run build
38+
env:
39+
NODE_ENV: production
40+
- name: 🚀 Release
41+
uses: cycjimmy/semantic-release-action@v3
42+
with:
43+
extra_plugins: |
44+
@pager/web-semantic-release-config
45+
@semantic-release/exec
46+
env:
47+
NPM_PUBLISH: 'true'
48+
GITHUB_TOKEN: ${{ secrets.GH_TOKEN }}
49+
SEMANTIC_RELEASE_PACKAGE: 'Eslint Plugin - CSS Modules'
50+
SKIP_MESSAGE: '[no github actions]'

.gitignore

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,6 @@
11
node_modules
22
.DS_Store
3+
.idea/
34

45
build
56
npm-debug.log

.nvmrc

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
18.16.0

README.md

Lines changed: 2 additions & 121 deletions
Original file line numberDiff line numberDiff line change
@@ -1,123 +1,4 @@
1-
# **status: NOT MAINTAINED**
2-
I have moved on to using css-in-js libraries like styled-components and emotion.
3-
So, not working on this project.
41

5-
# eslint-plugin-css-modules
2+
This fork fixes a problem in the original (no longer maintained) repo, where a .less file would cause es-lint errors if it included `CSS` custom properties overrides.
63

7-
[![Build Status](https://travis-ci.org/atfzl/eslint-plugin-css-modules.svg?branch=master)](https://travis-ci.org/atfzl/eslint-plugin-css-modules)
8-
9-
This plugin intends to help you in tracking down problems when you are using css-modules. It tells if you are using a non-existent css/scss/less class in js or if you forgot to use some classes which you declared in css/scss/less.
10-
11-
## Rules
12-
13-
* `css-modules/no-unused-class`: You must use all the classes defined in css/scss/less file.
14-
15-
>If you still want to mark a class as used, then use this comment on top of your file
16-
```js
17-
/* eslint css-modules/no-unused-class: [2, { markAsUsed: ['container'] }] */
18-
```
19-
where container is the css class that you want to mark as used.
20-
Add all such classes in the array.
21-
22-
>If you use the `camelCase` option of `css-loader`, you must also enabled it for this plugin
23-
```js
24-
/* eslint css-modules/no-unused-class: [2, { camelCase: true }] */
25-
```
26-
27-
* `css-modules/no-undef-class`: You must not use a non existing class, or a property that hasn't been exported using the [:export keyword](https://github.com/css-modules/icss#export).
28-
29-
>If you use the `camelCase` option of `css-loader`, you must also enabled it for this plugin
30-
```js
31-
/* eslint css-modules/no-undef-class: [2, { camelCase: true }] */
32-
```
33-
34-
## Installation
35-
36-
```
37-
npm i --save-dev eslint-plugin-css-modules
38-
```
39-
40-
## Usage:
41-
42-
.eslintrc
43-
```json
44-
{
45-
"plugins": [
46-
"css-modules"
47-
],
48-
"extends": [
49-
"plugin:css-modules/recommended"
50-
]
51-
}
52-
```
53-
54-
You may also tweak the rules individually. For instance, if you use the [camelCase](https://github.com/webpack-contrib/css-loader#camelcase) option of webpack's css-loader:
55-
56-
```json
57-
{
58-
"plugins": [
59-
"css-modules"
60-
],
61-
"extends": [
62-
"plugin:css-modules/recommended"
63-
],
64-
"rules": {
65-
"css-modules/no-unused-class": [2, { "camelCase": true }],
66-
"css-modules/no-undef-class": [2, { "camelCase": true }]
67-
}
68-
}
69-
```
70-
71-
The camelCase option has 4 possible values, see [css-loader#camelCase](https://github.com/webpack-contrib/css-loader#camelcase) for description:
72-
```js
73-
true | "dashes" | "only" | "dashes-only"
74-
```
75-
76-
## Specifying base path
77-
78-
You can specify path for the base directory via plugin settings in .eslintrc. This is used by the plugin to resolve absolute (S)CSS paths:
79-
80-
```json
81-
{
82-
"settings": {
83-
"css-modules": {
84-
"basePath": "app/scripts/..."
85-
}
86-
}
87-
}
88-
```
89-
90-
## Screen Shot
91-
92-
![ScreenShot](https://raw.githubusercontent.com/atfzl/eslint-plugin-css-modules/master/screenshots/screenshot3.png)
93-
94-
```
95-
1:8 error Unused classes found: container css-modules/no-unused-class
96-
5:17 error Class 'containr' not found css-modules/no-undef-class
97-
10:26 error Class 'foo' not found css-modules/no-undef-class
98-
```
99-
100-
scss:
101-
102-
```scss
103-
/* .head is global, will not be used in js */
104-
:global(.head) {
105-
color: green;
106-
}
107-
108-
.container {
109-
width: 116px;
110-
111-
i {
112-
font-size: 2.2rem;
113-
}
114-
115-
.button {
116-
padding: 7px 0 0 5px;
117-
}
118-
}
119-
120-
.footer {
121-
color: cyan;
122-
}
123-
```
4+
Please check the documentation for the original repo [here](https://github.com/atfzl/eslint-plugin-css-modules).

lib/core/index.js

Lines changed: 22 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -26,7 +26,7 @@ function dashesCamelCase (str: string) {
2626
}
2727

2828
export const getFilePath = (context, styleFilePath) => {
29-
const settings = context.settings['css-modules'];
29+
const settings = context.settings['@pager/eslint-plugin-css-modules'];
3030

3131
const dirName = path.dirname(context.getFilename());
3232
const basePath = (settings && settings.basePath) ? settings.basePath : '';
@@ -136,6 +136,27 @@ export const getAST = (filePath: string): gASTNode | null => {
136136

137137
const ast = gonzales.parse(fileContent.toString(), { syntax });
138138

139+
// const ampersandRegex = /([A-Za-z]+)&/;
140+
// const fileContentString = fileContent.toString();
141+
// .split('\n')
142+
// /* There is a bug in gonzales.parse. Parsing `.less` files which define css custom properties (like `--my-variable`) fails.
143+
// * So we just omit lines containing custom properties overrides. It's a quick and dirty fix, but it gets the job done. */
144+
// .filter((line) => !line.trim().startsWith('--'))
145+
// /* Another bug in gonzales. Parsing `.less` files which contains `&` attached to the right of selectors fails (so, things like `button&`,
146+
// * `.myClass&`, `.myClass& button`, `.myClass& button&`, ...). So, we just remove the `&` from such expressions. */
147+
// .map(line => {
148+
// let purgedLine = line;
149+
// let matchResult = purgedLine.match(ampersandRegex);
150+
// while (matchResult) {
151+
// purgedLine = purgedLine.replace(matchResult[0], matchResult[1]);
152+
// matchResult = purgedLine.match(ampersandRegex);
153+
// }
154+
// return purgedLine;
155+
// })
156+
// .join('\n');
157+
158+
// const ast = gonzales.parse(fileContentString, { syntax });
159+
139160
if (!ast) {
140161
throw new Error(`Could not parse ${filePath}`);
141162
}

lib/index.js

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -3,8 +3,8 @@ export rules from './rules';
33
export const configs = {
44
recommended: {
55
rules: {
6-
'css-modules/no-unused-class': 2, // error
7-
'css-modules/no-undef-class': 2, // error
6+
'@pager/css-modules/no-unused-class': 2, // error
7+
'@pager/css-modules/no-undef-class': 2, // error
88
}
99
}
1010
};

lib/rules/no-undef-class.js

Lines changed: 0 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -86,8 +86,6 @@ export default {
8686
return;
8787
}
8888

89-
90-
9189
// this will be used to check if classes are defined
9290
_.set(map, `${importName}.classesMap`, classesMap);
9391

package.json

Lines changed: 4 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
{
2-
"name": "eslint-plugin-css-modules",
3-
"version": "2.11.4",
2+
"name": "@pager/eslint-plugin-css-modules",
3+
"version": "2.17.0",
44
"description": "Checks that you are using the existent css/scss/less classes, no more no less",
55
"main": "build/index.js",
66
"files": [
@@ -13,9 +13,7 @@
1313
"lint": "eslint lib test",
1414
"test": "concurrently 'npm run test:rules' 'npm run test:mocha'",
1515
"test:rules": "babel-node ./test/lib/rules",
16-
"test:mocha": "mocha 'test/**/*.test.js'",
17-
"my-pre-publish": "concurrently 'npm run test' 'npm run build'",
18-
"my-publish": "npm run my-pre-publish && yarn publish"
16+
"test:mocha": "mocha 'test/**/*.test.js'"
1917
},
2018
"engines": {
2119
"node": ">=4.0.0"
@@ -26,14 +24,9 @@
2624
"eslint-plugin",
2725
"css-modules"
2826
],
29-
"author": {
30-
"name": "Atif Afzal",
31-
"email": "atif5801@gmail.com",
32-
"url": "http://atfzl.me"
33-
},
3427
"repository": {
3528
"type": "git",
36-
"url": "git://github.com/atfzl/eslint-plugin-css-modules.git"
29+
"url": "git://github.com/pagerinc/eslint-plugin-css-modules.git"
3730
},
3831
"license": "MIT",
3932
"peerDependencies": {

0 commit comments

Comments
 (0)