babel-plugin-app-decorators-style-precompile
v0.8.252
Published
babel plugin for app-decorators style decorator
Downloads
8
Readme
babel-plugin-app-decorators-style-precompile
Babel Plugin for auto generating code
Installation
$ npm install babel-plugin-app-decorators-style-precompile --save
Usage
Via .babelrc
(Recommended)
.babelrc
{
"plugins": ["app-decorators-style-precompile"]
}
.babelrc options
"plugins": [
["app-decorators-style-precompile", {
autoprefixer: "last 2 versions",
minify: true
}]
]
Via CLI
$ babel --plugins app-decorators-style-precompile script.js
Via Node API
require('babel').transform('code', {
plugins: ['app-decorators-style-precompile']
});
The goal of this babel-plugin is precompile precomplie the stylesheet inside of @style:
Example
Input:
@view(`
// this will be loaded async on load event
@on load {
@fetch my/async/styles1.css;
@fetch my/async/styles2.css;
}
// this applied immediately
.my-critical-path-selector {
width: 100px;
height: 100px;
}
`)
class Foo {
}
Output:
@view([
{
attachOn: "load",
imports: [
"my/async/styles1.css",
"my/async/styles1.css"
],
styles: "",
type: "on",
},
{
attachOn: "immediately",
imports: [],
styles: ".my-critical-path-selector { width: 100px; height: 100px; }",
type: "default",
},
])
class Foo {
}
Tests
git clone https://github.com/SerkanSipahi/app-decorators.git
cd app-decorators/packages/babel-plugin-app-decorators-style-precompile
make install
make test