mirror of
https://github.com/react/react-native-devtools-frontend.git
synced 2026-09-30 01:07:01 +08:00
Tim van der Lippe
6d109a9d45
This also adds Python-2.0 to the list of accepted licenses. Lastly, it fixes a bug where the package.json files were incorrectly reordered. For the `exports` of a particular package, the order that the entrypoints are defined in is crucial. Therefore, we should not alter the order of entrypoints and instead maintain the originally defined ordering. We can use an `OrderedDict` to ensure that Python always loads the JSON files in the same order. DISABLE_THIRD_PARTY_CHECK=NPM update R=jacktfranklin@chromium.org Bug: none Change-Id: I5a309782de6015edea6ba3b502aa0db1f008d973 Reviewed-on: https://chromium-review.googlesource.com/c/devtools/devtools-frontend/+/2692909 Auto-Submit: Tim van der Lippe <tvanderlippe@chromium.org> Reviewed-by: Jack Franklin <jacktfranklin@chromium.org> Commit-Queue: Tim van der Lippe <tvanderlippe@chromium.org>
PostCSS CSS-in-JS Syntax
PostCSS syntax for parsing CSS in JS literals:
- aphrodite
- astroturf
- csjs
- css-light
- cssobj
- electron-css
- emotion
- freestyler
- glamor
- glamorous
- j2c
- linaria
- lit-css
- react-native
- react-style
- reactcss
- styled-components
- styletron-react
- styling
- typestyle
Getting Started
First thing's first, install the module:
npm install postcss-syntax @stylelint/postcss-css-in-js --save-dev
Use Cases
const postcss = require("postcss");
const stylelint = require("stylelint");
const syntax = require("postcss-syntax");
postcss([stylelint({ fix: true })])
.process(source, { syntax: syntax })
.then(function (result) {
// An alias for the result.css property. Use it with syntaxes that generate non-CSS output.
result.content;
});
input:
import glm from "glamorous";
const Component1 = glm.a({
flexDirectionn: "row",
display: "inline-block",
color: "#fff"
});
output:
import glm from "glamorous";
const Component1 = glm.a({
color: "#fff",
display: "inline-block",
flexDirectionn: "row"
});
Advanced Use Cases
Add support for more css-in-js package:
const syntax = require("postcss-syntax")({
"i-css": (index, namespace) => namespace[index + 1] === "addStyles",
"styled-components": true
});
See: postcss-syntax
Style Transformations
The main use case of this plugin is to apply PostCSS transformations to CSS code in template literals & styles as object literals.