Some errors not reported

Aperta
  • Qualcosa non va?
#2 3 commenti 0 reazioni 0 assegnatari Vedi su GitHub

Nessuno ha ancora preso questa issue.

Valutazione

Difficoltà
3/5
Tempo stimato
1-2 giorni
Idoneità per principianti
65/100
Tipo di issue
Bug
Chiarezza
Specificata chiaramente
Stato di attività
Ferma
Ambito
testing-qa, tooling

Direzione di ricerca

L’issue mostra che i template literal contrassegnati con css non vengono sottoposti al linting. Inizia esaminando il parser nel codice sorgente per vedere come gestisce i diversi tag dei template literal. Esegui la demo Replit fornita per riprodurre il bug. Cerca i test relativi a styled-components ed emotion per capire il comportamento previsto. La correzione probabilmente consiste nell’aggiornare il parser affinché riconosca ed elabori il tag css.

Scritto dal modello di indicizzazione a partire dal testo della issue.

Descrizione

Hi @43081j 👋 First of all, thanks for all of your hard work on this and also postcss-js-core, so amazing!

It appears that some Stylelint errors are not reported with customSyntax: 'postcss-styled-components' along with setting some standard rules using extends: ['stylelint-config-recommended'] (eg. such as property-no-unknown):

import styled, { css } from 'styled-components';

const Div = styled.div`
  /* ✅ declaration-block-no-duplicate-properties reported */
  color: red;
  color: red;
  /* ❌ property-no-unknown not reported */
  booooorder: 1px solid red;
`;

const divStyles = css`
  /* ❌ declaration-block-no-duplicate-properties not reported */
  color: red;
  color: red;
  /* ❌ property-no-unknown not reported */
  booooorder: 1px solid red;
`;

It seems like the css tagged template literals are possibly not checked at all? 🤔

This is also similarly broken when using Emotion:

import { css } from '@emotion/react';
import styled from '@emotion/styled';

const Div = styled.div`
  /* ✅ declaration-block-no-duplicate-properties reported */
  color: red;
  color: red;
  /* ❌ property-no-unknown not reported */
  booooorder: 1px solid red;
`;

const divStyles = css`
  /* ❌ declaration-block-no-duplicate-properties not reported */
  color: red;
  color: red;
  /* ❌ property-no-unknown not reported */
  booooorder: 1px solid red;
`;

I've created an interactive demo of this on Replit.

To use it, change to the Shell tab on the right and run npm install and then npm run lint.

Demo (Replit): https://replit.com/@karlhorky/customSyntax-postcss-styled-components#styled-components.js

Screenshot 2022-12-30 at 23 17 36

Note that this does not use the nesting or other features of Sass (eg. to test out #1) because I haven't been able to get customSyntax: "postcss-styled-components/scss" working yet, as I mentioned here:

I will open new issues about any problems with these features once I can get the other entrypoints working.

Lingua principale
TypeScript
Stelle
12
Fork
1
Nessuna PR unita negli ultimi 30g

Preparare l'ambiente

Questo progetto non fornisce container di sviluppo, Dockerfile né guida per i contributori, quindi l'ambiente è a tuo carico: parti dal suo README e consulta la nostra guida al primo contributo per i passaggi generali.

Come iniziare

  1. Leggi tutta la issue e poi la guida ai contributi del progetto.
  2. Commenta sulla issue per dire che te ne occupi tu — evita che due persone facciano lo stesso lavoro.
  3. Fai un fork del repository e lavora su un branch.
  4. Apri una pull request che faccia riferimento al numero della issue.

Altre issue di 43081j/postcss-styled-components

Tutte le issue di 43081j/postcss-styled-components

Issue simili

Altre issue su TypeScript

Ricevi le nuove issue nella tua casella

Un breve riepilogo di issue GitHub adatte ai principianti.