Hot module replacement for react-jss
License: MIT License
Move the site engine to a separate repo. It can be actually used for any projects.
File a bug against cssinjs/jss prefixed with [site].
After upgrading to react-jss@^10.0.0 throws error
Library that is imported uses react-jss hooks and is built with webpack.
I have a few questions about the code.
Do we need this check, because the user should only add the plugin in the dev config anyway? This should remove the need for the ternary.
Is using the name here a good idea? Because when two components have the same name, we got a problem.
Also, I'm not a fan of the inline function in the ternary.
Hi !
I tried this plugin as I said on the react-jss repo. I first tried your fix/hmr branch on the main repo and it works flawlessly.
I revert to the master branch and added this plugin to my webpack config, but it seems not working with webpack-dev-server
Here is the stack :
Error: Plugin could not be registered at 'described-resolve'. Hook was not found.
BREAKING CHANGE: There need to exist a hook at 'this.hooks'. To create a compatiblity l
ayer for this hook, hook into 'this._pluginCompat'.
at Compiler.plugin (/Users/thomas/Dev/react-ssr/node_modules/tapable/lib/Tapable.js:63:9)
at Compiler.deprecated [as plugin] (internal/util.js:70:15)
at ReactJssHmrPlugin.apply (/Users/thomas/Dev/react-ssr/node_modules/react-jss-hmr/lib/ReactJssHmrPlugin.js:39:16)
at webpack (/Users/thomas/Dev/react-ssr/node_modules/webpack/lib/webpack.js:37:12)
at startDevServer (/Users/thomas/Dev/react-ssr/node_modules/webpack-dev-server/bin/webpack-dev-server.js:379:16)
at portfinder.getPort (/Users/thomas/Dev/react-ssr/node_modules/webpack-dev-server/bin/webpack-dev-server.js:369:5)
at /Users/thomas/Dev/react-ssr/node_modules/portfinder/lib/portfinder.js:160:14
at /Users/thomas/Dev/react-ssr/node_modules/async/lib/async.js:52:16
at /Users/thomas/Dev/react-ssr/node_modules/async/lib/async.js:269:32
at /Users/thomas/Dev/react-ssr/node_modules/async/lib/async.js:44:16
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! [email protected] dev:client: `webpack-dev-server --hot`
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the [email protected] dev:client script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.
npm ERR! A complete log of this run can be found in:
npm ERR! /Users/thomas/.npm/_logs/2018-07-10T07_07_21_439Z-debug.log
ERROR: "dev:client" exited with 1.
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! [email protected] dev: `npm-run-all --parallel dev:*`
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the [email protected] dev script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.
Here is my webpack.config.js:
const path = require("path")
const HtmlWebPackPlugin = require("html-webpack-plugin")
const ReactJssHmrPlugin = require("react-jss-hmr/webpack")
module.exports = {
entry: "./src/client/client.js",
mode: "development",
output: {
path: path.resolve(__dirname),
filename: "bundle.js"
},
devServer: {
overlay: true,
proxy: {
"/api": {
target: "http://localhost:3000"
}
}
},
module: {
rules: [
{
test: /\.js$/,
exclude: /node_modules/,
use: "babel-loader"
}
]
},
plugins: [
new HtmlWebPackPlugin({
template: "./src/client/index.html"
}),
new ReactJssHmrPlugin()
]
}and my npm scripts
"scripts": {
"dev:server": "nodemon src/server/server.js",
"dev:client": "webpack-dev-server --hot",
"dev": "npm-run-all --parallel dev:*"
}Any tips ?
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
Django
The Web framework for perfectionists with deadlines.
Laravel
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
Microsoft
Open source projects and samples from Microsoft.
Google
Google ❤️ Open Source for everyone.
Alibaba
Alibaba Open Source for everyone
D3
Data-Driven Documents codes.
Tencent
China tencent open source team.