An inline style parser copied from css/lib/parse/index.js:
InlineStyleParser(string)
Example:
var parse = require('inline-style-parser');
parse('color: #BADA55;');Output:
[ { type: 'declaration',
property: 'color',
value: '#BADA55',
position: Position { start: [Object], end: [Object], source: undefined } } ]NPM:
$ npm install inline-style-parser --saveYarn:
$ yarn add inline-style-parserCDN:
<script src="https://unpkg.com/inline-style-parser@latest/dist/inline-style-parser.min.js"></script>
<script>
window.InlineStyleParser(/* string */);
</script>Import the module:
// CommonJS
const parse = require('inline-style-parser');
// ES Modules
import parse from 'inline-style-parser';Parse single declaration:
parse('left: 0');Output:
[
{
type: 'declaration',
property: 'left',
value: '0',
position: {
start: { line: 1, column: 1 },
end: { line: 1, column: 8 },
source: undefined
}
}
]Parse multiple declarations:
parse('left: 0; right: 100px;');Output:
[
{
type: 'declaration',
property: 'left',
value: '0',
position: {
start: { line: 1, column: 1 },
end: { line: 1, column: 8 },
source: undefined
}
},
{
type: 'declaration',
property: 'right',
value: '100px',
position: {
start: { line: 1, column: 10 },
end: { line: 1, column: 22 },
source: undefined
}
}
]Parse declaration with missing value:
parse('top:');Output:
[
{
type: 'declaration',
property: 'top',
value: '',
position: {
start: { line: 1, column: 1 },
end: { line: 1, column: 5 },
source: undefined
}
}
]Parse unknown declaration:
parse('answer: 42;');Output:
[
{
type: 'declaration',
property: 'answer',
value: '42',
position: {
start: { line: 1, column: 1 },
end: { line: 1, column: 11 },
source: undefined
}
}
]Invalid declarations:
parse(''); // []
parse(); // throws TypeError
parse(1); // throws TypeError
parse('width'); // throws Error
parse('/*'); // throws ErrorRun tests:
$ npm testRun tests in watch mode:
$ npm run test:watchRun tests with coverage:
$ npm run test:coverageRun tests in CI mode:
$ npm run test:ciLint files:
$ npm run lintFix lint errors:
$ npm run lint:fixOnly collaborators with credentials can release and publish:
$ npm run release
$ git push --follow-tags && npm publishMIT. See license from original project.
React
Typescript
Django
Laravel
Facebook
Microsoft
Google
Alibaba
D3
Tencent