diff --git a/.gitignore b/.gitignore
index dadcda3..86ad2d0 100644
--- a/.gitignore
+++ b/.gitignore
@@ -1,3 +1,4 @@
/node_modules
npm-debug*
+/build
/dist
\ No newline at end of file
diff --git a/app/index.html b/app/index.html
new file mode 100644
index 0000000..e52e269
--- /dev/null
+++ b/app/index.html
@@ -0,0 +1,12 @@
+
+
+
+
+ Sprinklers3
+
+
+
+
+
+
+
\ No newline at end of file
diff --git a/app/script/App.tsx b/app/script/App.tsx
index 68653cd..899694f 100644
--- a/app/script/App.tsx
+++ b/app/script/App.tsx
@@ -38,10 +38,10 @@ class ProgramRow extends React.PureComponent<{ program: Program }, void> {
@observer
class DeviceView extends React.PureComponent<{ device: SprinklersDevice }, void> {
render() {
- const { id, connected, sections, programs } = this.props.device; //src={require("app/images/raspberry_pi.png")}
+ const { id, connected, sections, programs } = this.props.device;
return (
-
-
+ ("app/images/raspberry_pi.png")} />
Device {id}
diff --git a/app/script/index.tsx b/app/script/index.tsx
index 0879362..f9a1040 100644
--- a/app/script/index.tsx
+++ b/app/script/index.tsx
@@ -9,8 +9,7 @@ const client = new MqttApiClient();
client.start();
const device = client.getDevice("grinklers");
-const rootElem = document.createElement("div");
-document.body.appendChild(rootElem);
+const rootElem = document.getElementById("app");
ReactDOM.render(
diff --git a/package.json b/package.json
index 0fcc631..555da75 100644
--- a/package.json
+++ b/package.json
@@ -6,9 +6,9 @@
"main": "index.js",
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1",
- "clean": "rm -rf ./dist",
- "build": "webpack",
- "start:dev": "webpack-dev-server"
+ "clean": "rm -rf ./dist ./build",
+ "build": "webpack --config ./webpack/prod.config.js",
+ "start:dev": "webpack-dev-server --config ./webpack/dev.config.js"
},
"repository": {
"type": "git",
diff --git a/webpack.config.js b/webpack/dev.config.js
similarity index 92%
rename from webpack.config.js
rename to webpack/dev.config.js
index 691f4ec..80512eb 100644
--- a/webpack.config.js
+++ b/webpack/dev.config.js
@@ -11,7 +11,7 @@ module.exports = {
],
devtool: "inline-source-map",
output: {
- path: path.resolve(__dirname, "dist"),
+ path: path.resolve(__dirname, "build"),
filename: "bundle.js"
},
resolve: {
@@ -29,7 +29,7 @@ module.exports = {
},
plugins: [
new HtmlWebpackPlugin({
- title: "sprinklers3"
+ template: "./app/index.html"
}),
new webpack.NamedModulesPlugin(),
new webpack.HotModuleReplacementPlugin()
diff --git a/webpack/prod.config.js b/webpack/prod.config.js
new file mode 100644
index 0000000..a3e51ae
--- /dev/null
+++ b/webpack/prod.config.js
@@ -0,0 +1,32 @@
+const path = require("path");
+const webpack = require("webpack");
+const HtmlWebpackPlugin = require("html-webpack-plugin");
+
+module.exports = {
+ entry: [
+ "./app/script/index.tsx"
+ ],
+ devtool: "none",
+ output: {
+ path: path.resolve(__dirname, "dist"),
+ filename: "bundle.js"
+ },
+ resolve: {
+ extensions: [".ts", ".tsx", ".js"],
+ alias: {
+ app: path.resolve("./app")
+ }
+ },
+ module: {
+ rules: [
+ { test: /\.tsx?$/, loader: "awesome-typescript-loader" },
+ { test: /\.css$/, loader: "style-loader!css-loader" },
+ { test: /\.(ttf|eot|svg|woff(2)?|png|jpg)(\?[a-z0-9=&.]+)?$/, loader: "file-loader" }
+ ]
+ },
+ plugins: [
+ new HtmlWebpackPlugin({
+ template: "./app/index.html"
+ })
+ ]
+};
\ No newline at end of file