single-react-loader

中文版

write react in single file with webpack

feature

1. combine jsx and css in single file
2. support less,sass
3. support style scoped

example

``
//about.react



`

how to use

1.install the single-react-loader package with npm

`
npm install single-react-loader
`
2.config your webpack

$3


`
//webpack.config.js
module: {
loaders: [
{
test: /\.react$/,
exclude: /node_modules/,
loader: 'single-react'
}
]
}

`

$3


`
//webpack.config.js
module: {
rules: [
{
test: /\.react$/,
exclude: /node_modules/,
loader: 'single-react-loader'
}
]
}
`

3.write single file react,and import

`
import About from 'About.react'
`

$3

`
// app.react


`

$3

`
// app.react



`

highlight and snippet

$3

Place the following snippet into your settings file.

`
{
"files.associations": {
"*.react": "html"
}
}
`

$3

!show


1. open *.react file
2. click view-->syntax-->open all with current extension as.. --> HTML




What next

1.support sourceMap
~~2.support style scope~~

And then i will write plugin with common editor such as sublime` for code snnipets and highlight

You can contact me if you have any idea.You also can join us to help single-react stronger.