From 0d1359d43a4f6805a431f2e15d15a2550004116b Mon Sep 17 00:00:00 2001 From: Tyler Schicke Date: Sat, 9 Feb 2019 21:38:27 -0500 Subject: Added our own server with webpack-dev-middleware --- package.json | 11 +++++++++-- 1 file changed, 9 insertions(+), 2 deletions(-) (limited to 'package.json') diff --git a/package.json b/package.json index 9afddb8d9..65c718283 100644 --- a/package.json +++ b/package.json @@ -4,7 +4,7 @@ "description": "", "main": "index.js", "scripts": { - "start": "webpack-dev-server --mode development --color --progress --inline --hot --env development", + "start": "nodemon --watch src/server/**/*.ts --exec ts-node src/server/index.ts", "build": "webpack --env production", "test": "mocha -r ts-node/register test/**/*.ts" }, @@ -12,6 +12,7 @@ "@types/chai": "^4.1.7", "@types/mocha": "^5.2.5", "@types/react-dom": "^16.0.9", + "@types/webpack-dev-middleware": "^2.0.2", "awesome-typescript-loader": "^5.2.1", "chai": "^4.2.0", "copy-webpack-plugin": "^4.6.0", @@ -24,11 +25,14 @@ "typescript": "^3.3.1", "webpack": "^4.29.1", "webpack-cli": "^3.2.1", + "webpack-dev-middleware": "^3.5.2", "webpack-dev-server": "^3.1.14" }, "dependencies": { "@fortawesome/fontawesome-svg-core": "^1.2.14", + "@types/express": "^4.16.1", "@types/jquery": "^3.3.29", + "@types/node": "^10.12.24", "@types/prosemirror-commands": "^1.0.1", "@types/prosemirror-history": "^1.0.1", "@types/prosemirror-keymap": "^1.0.1", @@ -40,12 +44,15 @@ "@types/react-table": "^6.7.21", "@types/typescript": "^2.0.0", "@types/uuid": "^3.4.4", + "@types/webpack": "^4.4.24", + "express": "^4.16.4", "flexlayout-react": "^0.3.3", "golden-layout": "^1.5.9", "mobx": "^5.9.0", "mobx-react": "^5.3.5", "mobx-react-devtools": "^6.0.3", "node-sass": "^4.11.0", + "nodemon": "^1.18.10", "normalize.css": "^8.0.1", "npm": "^6.7.0", "prosemirror-commands": "^1.0.7", @@ -67,4 +74,4 @@ "url-loader": "^1.1.2", "uuid": "^3.3.2" } -} +} \ No newline at end of file -- cgit v1.2.3-70-g09d2 From 099c5823f05285fc5086c5a433658cf06dc4a04b Mon Sep 17 00:00:00 2001 From: Tyler Schicke Date: Sat, 9 Feb 2019 22:06:27 -0500 Subject: Got Hot-Module-Reloading working --- package-lock.json | 22 ++++++++++++++++++++++ package.json | 6 ++++-- src/client/views/Main.tsx | 2 +- src/server/index.ts | 3 +++ webpack.config.js | 7 +++++-- 5 files changed, 35 insertions(+), 5 deletions(-) (limited to 'package.json') diff --git a/package-lock.json b/package-lock.json index 07fe093fd..535c348d5 100644 --- a/package-lock.json +++ b/package-lock.json @@ -297,6 +297,16 @@ "@types/webpack": "*" } }, + "@types/webpack-hot-middleware": { + "version": "2.16.4", + "resolved": "https://registry.npmjs.org/@types/webpack-hot-middleware/-/webpack-hot-middleware-2.16.4.tgz", + "integrity": "sha512-z9np8JOIx7P66GMPJn+FkFcClo1RZZvmwVp9GAfupcEF1i+6+QmVaozTPZwpHexukgVy0F7RRQkybAeV2y+RjA==", + "dev": true, + "requires": { + "@types/connect": "*", + "@types/webpack": "*" + } + }, "@webassemblyjs/ast": { "version": "1.7.11", "resolved": "https://registry.npmjs.org/@webassemblyjs/ast/-/ast-1.7.11.tgz", @@ -11139,6 +11149,18 @@ } } }, + "webpack-hot-middleware": { + "version": "2.24.3", + "resolved": "https://registry.npmjs.org/webpack-hot-middleware/-/webpack-hot-middleware-2.24.3.tgz", + "integrity": "sha512-pPlmcdoR2Fn6UhYjAhp1g/IJy1Yc9hD+T6O9mjRcWV2pFbBjIFoJXhP0CoD0xPOhWJuWXuZXGBga9ybbOdzXpg==", + "dev": true, + "requires": { + "ansi-html": "0.0.7", + "html-entities": "^1.2.0", + "querystring": "^0.2.0", + "strip-ansi": "^3.0.0" + } + }, "webpack-log": { "version": "1.2.0", "resolved": "https://registry.npmjs.org/webpack-log/-/webpack-log-1.2.0.tgz", diff --git a/package.json b/package.json index 65c718283..6697b5f47 100644 --- a/package.json +++ b/package.json @@ -13,6 +13,7 @@ "@types/mocha": "^5.2.5", "@types/react-dom": "^16.0.9", "@types/webpack-dev-middleware": "^2.0.2", + "@types/webpack-hot-middleware": "^2.16.4", "awesome-typescript-loader": "^5.2.1", "chai": "^4.2.0", "copy-webpack-plugin": "^4.6.0", @@ -26,7 +27,8 @@ "webpack": "^4.29.1", "webpack-cli": "^3.2.1", "webpack-dev-middleware": "^3.5.2", - "webpack-dev-server": "^3.1.14" + "webpack-dev-server": "^3.1.14", + "webpack-hot-middleware": "^2.24.3" }, "dependencies": { "@fortawesome/fontawesome-svg-core": "^1.2.14", @@ -74,4 +76,4 @@ "url-loader": "^1.1.2", "uuid": "^3.3.2" } -} \ No newline at end of file +} diff --git a/src/client/views/Main.tsx b/src/client/views/Main.tsx index fc6f0a208..9a359e868 100644 --- a/src/client/views/Main.tsx +++ b/src/client/views/Main.tsx @@ -44,7 +44,7 @@ document.addEventListener("pointerdown", action(function (e: PointerEvent) { doc2.Set(KS.X, new NumberField(150)); doc2.Set(KS.Y, new NumberField(20)); let doc3 = Documents.ImageDocument("https://upload.wikimedia.org/wikipedia/commons/thumb/3/3a/Cat03.jpg/1200px-Cat03.jpg", { - x: 450, y: 500, title: "cat 1" + x: 450, y: 100, title: "cat 1" }); doc3.Set(KeyStore.Data, new ImageField); const schemaDocs = Array.from(Array(5).keys()).map(v => Documents.ImageDocument("https://upload.wikimedia.org/wikipedia/commons/thumb/3/3a/Cat03.jpg/1200px-Cat03.jpg", { diff --git a/src/server/index.ts b/src/server/index.ts index f3db7c73b..640ad8180 100644 --- a/src/server/index.ts +++ b/src/server/index.ts @@ -2,6 +2,7 @@ import * as express from 'express' const app = express() import * as webpack from 'webpack' import * as wdm from 'webpack-dev-middleware'; +import * as whm from 'webpack-hot-middleware'; import * as path from 'path' const config = require('../../webpack.config') const compiler = webpack(config) @@ -20,6 +21,8 @@ app.use(wdm(compiler, { publicPath: config.output.publicPath })) +app.use(whm(compiler)) + // start the Express server app.listen(port, () => { console.log(`server started at http://localhost:${port}`); diff --git a/webpack.config.js b/webpack.config.js index 73538c2df..478c900b2 100644 --- a/webpack.config.js +++ b/webpack.config.js @@ -4,7 +4,7 @@ const CopyWebpackPlugin = require("copy-webpack-plugin"); module.exports = { mode: 'development', - entry: "./src/client/views/Main.tsx", + entry: ["./src/client/views/Main.tsx", 'webpack-hot-middleware/client?reload=true'], devtool: "source-map", node: { fs: 'empty', @@ -50,7 +50,10 @@ module.exports = { }] }, plugins: [ - new CopyWebpackPlugin([{ from: "deploy", to: path.join(__dirname, "build") }]) + new CopyWebpackPlugin([{ from: "deploy", to: path.join(__dirname, "build") }]), + new webpack.optimize.OccurrenceOrderPlugin(), + new webpack.HotModuleReplacementPlugin(), + new webpack.NoEmitOnErrorsPlugin() ], devServer: { compress: false, -- cgit v1.2.3-70-g09d2