https://github.com/skyrpex/vue-jsx-hot-loader
Webpack loader for Vue.js v2 components with JSX render functions
https://github.com/skyrpex/vue-jsx-hot-loader
hot jsx loader vue webpack
Last synced: 2 months ago
JSON representation
Webpack loader for Vue.js v2 components with JSX render functions
- Host: GitHub
- URL: https://github.com/skyrpex/vue-jsx-hot-loader
- Owner: skyrpex
- License: mit
- Created: 2016-09-22T13:01:33.000Z (about 9 years ago)
- Default Branch: master
- Last Pushed: 2024-08-06T12:03:43.000Z (over 1 year ago)
- Last Synced: 2025-09-06T23:48:59.777Z (3 months ago)
- Topics: hot, jsx, loader, vue, webpack
- Language: JavaScript
- Homepage: https://www.npmjs.com/package/vue-jsx-hot-loader
- Size: 419 KB
- Stars: 41
- Watchers: 4
- Forks: 5
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
- awesome-vue - vue-jsx-hot-loader - Enable HMR for Vue.js components with JSX render functions. (Components & Libraries / Utilities)
- awesome-vue - vue-jsx-hot-loader - Webpack loader for Vue.js v2 components with JSX render functions ` 📝 2 years ago` (Utilities [🔝](#readme))
- awesome-vue-zh - Vue-JSX热装载机 - 使用JSX渲染功能为Vue.js组件启用HMR. (公用事业 / 资产管理)
- fucking-awesome-vue - vue-jsx-hot-loader - Enable HMR for Vue.js components with JSX render functions. (Components & Libraries / Utilities)
- awesome-vue - vue-jsx-hot-loader ★28 - Enable HMR for Vue.js components with JSX render functions. (Utilities / Asset Management)
- awesome-vue - vue-jsx-hot-loader - Enable HMR for Vue.js components with JSX render functions. (Components & Libraries / Utilities)
- awesome-vue - vue-jsx-hot-loader - Enable HMR for Vue.js components with JSX render functions. (Utilities / Asset Management)
README
# vue-jsx-hot-loader
[](https://greenkeeper.io/)
[](https://travis-ci.org/skyrpex/vue-jsx-hot-loader)
> Works with:
>
> 
> 
This loader will enable `Hot Module Replacement` for [Webpack](http://webpack.js.org/) when using Vue's JSX render functions.
## Installation
`npm install vue-jsx-hot-loader`
## Usage
```js
// path/to/component.jsx
export default {
render(h) {
return (
Hello
);
},
};
```
```js
// webpack.config.js
export default {
// ...
module: {
loaders: [
// Enable HMR for JSX.
{
test: /\.jsx$/,
use: [
'babel-loader',
'vue-jsx-hot-loader',
],
},
// Remember to use babel on the rest of the JS files.
{
test: /\.js$/,
use: 'babel-loader',
},
],
},
};
```
## Gotchas
* It only works for the default exported module (which should normally be the component itself).
## Development
### Playground
```bash
npm run playground
```
### Release
```bash
npx np
```