chore: upgrade deps

also, log message on build ready with webpack dev middleware hook
This commit is contained in:
Haishan 2019-01-18 23:51:30 +08:00
parent 2ee638b9ca
commit f364975545
5 changed files with 615 additions and 436 deletions

View file

@ -30,6 +30,7 @@
"dependencies": { "dependencies": {
"@babel/polyfill": "^7.2.3", "@babel/polyfill": "^7.2.3",
"@babel/runtime": "^7.1.5", "@babel/runtime": "^7.1.5",
"@hsjs/react-cache": "0.0.0-alpha.aa94237",
"@sentry/browser": "^4.4.2", "@sentry/browser": "^4.4.2",
"chart.js": "^2.7.3", "chart.js": "^2.7.3",
"classnames": "^2.2.6", "classnames": "^2.2.6",
@ -39,9 +40,8 @@
"memoize-one": "^5.0.0", "memoize-one": "^5.0.0",
"modern-normalize": "^0.5.0", "modern-normalize": "^0.5.0",
"prop-types": "^15.5.10", "prop-types": "^15.5.10",
"react": "16.7.0-alpha.2", "react": "16.8.1",
"react-cache": "2.0.0-alpha.1", "react-dom": "16.8.1",
"react-dom": "16.7.0-alpha.2",
"react-modal": "^3.8.1", "react-modal": "^3.8.1",
"react-router-dom": "4.4.0-beta.4", "react-router-dom": "4.4.0-beta.4",
"react-window": "^1.5.0", "react-window": "^1.5.0",
@ -70,29 +70,29 @@
"copy-webpack-plugin": "^4.6.0", "copy-webpack-plugin": "^4.6.0",
"css-loader": "^2.0.1", "css-loader": "^2.0.1",
"cssnano": "^4.1.7", "cssnano": "^4.1.7",
"eslint": "^5.12.0", "eslint": "^5.13.0",
"eslint-import-resolver-webpack": "^0.10.1", "eslint-import-resolver-webpack": "^0.11.0",
"eslint-plugin-import": "2.14.0", "eslint-plugin-import": "^2.16.0",
"eslint-plugin-jest": "^22.0.0", "eslint-plugin-jest": "^22.0.0",
"eslint-plugin-react": "7.11.1", "eslint-plugin-react": "7.11.1",
"eslint-plugin-react-hooks": "^0.0.0", "eslint-plugin-react-hooks": "^1.0.1",
"file-loader": "^3.0.0", "file-loader": "^3.0.0",
"html-webpack-plugin": "^3.2.0", "html-webpack-plugin": "^3.2.0",
"husky": "^1.3.0", "husky": "^1.3.0",
"lint-staged": "^8.0.2", "lint-staged": "^8.1.3",
"mini-css-extract-plugin": "^0.5.0", "mini-css-extract-plugin": "^0.5.0",
"node-sass": "^4.10.0", "node-sass": "^4.10.0",
"postcss-loader": "^3.0.0", "postcss-loader": "^3.0.0",
"prettier": "^1.15.1", "prettier": "^1.16.4",
"react-hot-loader": "^4.6.3", "react-hot-loader": "^4.6.3",
"sass-loader": "^7.0.1", "sass-loader": "^7.0.1",
"style-loader": "^0.23.0", "style-loader": "^0.23.0",
"svg-sprite-loader": "^4.1.2", "svg-sprite-loader": "^4.1.2",
"terser-webpack-plugin": "^1.1.0", "terser-webpack-plugin": "^1.2.2",
"webpack": "^4.28.4", "webpack": "^4.29.3",
"webpack-bundle-analyzer": "^3.0.3", "webpack-bundle-analyzer": "^3.0.3",
"webpack-cli": "^3.2.1", "webpack-cli": "^3.2.3",
"webpack-dev-middleware": "^3.5.0", "webpack-dev-middleware": "^3.5.2",
"webpack-hot-middleware": "^2.22.2" "webpack-hot-middleware": "^2.22.2"
} }
} }

View file

@ -37,8 +37,10 @@ const stats = {
const options = { publicPath, stats }; const options = { publicPath, stats };
app.use(devMiddleware(compiler, options)); const wdm = devMiddleware(compiler, options);
app.use(hotMiddleware(compiler)); const whm = hotMiddleware(compiler);
app.use(wdm);
app.use(whm);
app.use('*', (req, res, next) => { app.use('*', (req, res, next) => {
const filename = path.join(compiler.outputPath, 'index.html'); const filename = path.join(compiler.outputPath, 'index.html');
@ -54,3 +56,10 @@ app.use('*', (req, res, next) => {
app.listen(port, '0.0.0.0', () => { app.listen(port, '0.0.0.0', () => {
console.log('\n>> Listening at http://0.0.0.0:' + port + '\n'); console.log('\n>> Listening at http://0.0.0.0:' + port + '\n');
}); });
wdm.waitUntilValid(() => {
console.log('\n===> Build ready at:\n');
console.log(` http://0.0.0.0:${port}`);
console.log(` http://127.0.0.1:${port}`);
console.log(` http://localhost:${port}`);
});

View file

@ -7,8 +7,10 @@ import Root from './components/Root';
Modal.setAppElement('#app'); Modal.setAppElement('#app');
const { unstable_createRoot: createRoot } = ReactDOM;
// use async React // use async React
const root = ReactDOM.createRoot(document.getElementById('app')); const root = createRoot(document.getElementById('app'));
root.render(<Root />); root.render(<Root />);
// const render = (Component, props = {}) => { // const render = (Component, props = {}) => {

View file

@ -1,7 +1,7 @@
import React, { useEffect } from 'react'; import React, { useEffect } from 'react';
import prettyBytes from 'm/pretty-bytes'; import prettyBytes from 'm/pretty-bytes';
import { fetchData } from '../api/traffic'; import { fetchData } from '../api/traffic';
import { unstable_createResource as createResource } from 'react-cache'; import { unstable_createResource as createResource } from '@hsjs/react-cache';
import { useStoreState } from 'm/store'; import { useStoreState } from 'm/store';
import { getClashAPIConfig, getTheme } from 'd/app'; import { getClashAPIConfig, getTheme } from 'd/app';
@ -145,8 +145,7 @@ export default function TrafficChart() {
const { hostname, port, secret } = useStoreState(getClashAPIConfig); const { hostname, port, secret } = useStoreState(getClashAPIConfig);
const theme = useStoreState(getTheme); const theme = useStoreState(getTheme);
useEffect( useEffect(() => {
() => {
const ctx = document.getElementById('trafficChart').getContext('2d'); const ctx = document.getElementById('trafficChart').getContext('2d');
const traffic = fetchData({ hostname, port, secret }); const traffic = fetchData({ hostname, port, secret });
const upProps = getUploadProps(theme); const upProps = getUploadProps(theme);
@ -174,9 +173,7 @@ export default function TrafficChart() {
unsubscribe(); unsubscribe();
c.destroy(); c.destroy();
}; };
}, }, [hostname, port, secret, theme]);
[hostname, port, secret, theme]
);
return ( return (
<div style={chartWrapperStyle}> <div style={chartWrapperStyle}>

945
yarn.lock

File diff suppressed because it is too large Load diff