mirror of
https://github.com/c8r/x0.git
synced 2024-09-11 21:57:26 +03:00
Add mdx-loader
This commit is contained in:
parent
9d836f7154
commit
06293a7151
16
README.md
16
README.md
@ -279,6 +279,20 @@ scope: import * as scope from 'rebass'
|
||||
</Box>
|
||||
```
|
||||
|
||||
### MDX Format
|
||||
|
||||
x0 includes support for [MDX][mdx] format files.
|
||||
|
||||
```mdx
|
||||
import { Box } from 'rebass'
|
||||
|
||||
# Hello MDX
|
||||
|
||||
<Box p={4} bg='tomato'>
|
||||
Beep Boop
|
||||
</Box>
|
||||
```
|
||||
|
||||
### webpack
|
||||
|
||||
Webpack configuration files named `webpack.config.js` will automatically be merged with the built-in configuration, using [webpack-merge][webpack-merge].
|
||||
@ -300,6 +314,7 @@ See the [example](examples/webpack-config).
|
||||
#### Related
|
||||
|
||||
- [Compositor JSX][jsx-loader]
|
||||
- [MDX][mdx]
|
||||
- [React Router][react-router]
|
||||
- [Mini HTML Webpack Plugin][mini-html]
|
||||
- [Styled Components][sc]
|
||||
@ -316,6 +331,7 @@ See the [example](examples/webpack-config).
|
||||
[MIT License](LICENSE.md)
|
||||
|
||||
[jsx-loader]: https://github.com/c8r/jsx-loader
|
||||
[mdx]: https://github.com/mdx-js/mdx
|
||||
[nextjs]: https://github.com/zeit/next.js
|
||||
[react-router]: https://github.com/ReactTraining/react-router
|
||||
[mini-html]: https://github.com/styleguidist/mini-html-webpack-plugin
|
||||
|
@ -13,6 +13,9 @@ export default class extends React.Component {
|
||||
<li>
|
||||
<Link to='/hello'>Hello JSX</Link>
|
||||
</li>
|
||||
<li>
|
||||
<Link to='/mdx'>MDX</Link>
|
||||
</li>
|
||||
</ul>
|
||||
<video
|
||||
style={{
|
||||
|
10
docs/mdx.mdx
Normal file
10
docs/mdx.mdx
Normal file
@ -0,0 +1,10 @@
|
||||
import { Box, Heading } from 'rebass'
|
||||
|
||||
# Hello MDX
|
||||
|
||||
<Box px={3} py={4} bg='tomato'>
|
||||
<Heading
|
||||
fontSize={[ 4, 5, 6, 7 ]}>
|
||||
Hello
|
||||
</Heading>
|
||||
</Box>
|
@ -30,6 +30,18 @@ const rules = [
|
||||
test: /\.jsx$/,
|
||||
loader: require.resolve('@compositor/jsx-loader'),
|
||||
options: {}
|
||||
},
|
||||
{
|
||||
test: /\.mdx$/,
|
||||
use: [
|
||||
{
|
||||
loader: require.resolve('babel-loader'),
|
||||
options: babel
|
||||
},
|
||||
{
|
||||
loader: require.resolve('@mdx-js/loader')
|
||||
}
|
||||
]
|
||||
}
|
||||
]
|
||||
|
||||
|
@ -19,6 +19,8 @@
|
||||
"dependencies": {
|
||||
"@compositor/jsx-loader": "^1.0.0-2",
|
||||
"@compositor/log": "^1.0.0-0",
|
||||
"@mdx-js/loader": "^0.9.0",
|
||||
"@mdx-js/mdx": "^0.9.0",
|
||||
"babel-core": "^6.26.3",
|
||||
"babel-loader": "^7.1.4",
|
||||
"babel-plugin-macros": "^2.2.1",
|
||||
@ -55,9 +57,10 @@
|
||||
"isomorphic-fetch": "^2.2.1",
|
||||
"nano-style": "^1.0.0",
|
||||
"nyc": "^11.8.0",
|
||||
"rebass": "^2.0.0-2",
|
||||
"refunk": "^2.2.4",
|
||||
"styled-components": "^3.2.6",
|
||||
"styled-system": "^1.1.7"
|
||||
"styled-system": "^2.2.5"
|
||||
},
|
||||
"x0": {
|
||||
"title": "Compositor x0",
|
||||
|
Loading…
Reference in New Issue
Block a user