From cd38bf4a6f67a5ba4c9472b62ce8c59b9a501349 Mon Sep 17 00:00:00 2001 From: Dylan Date: Fri, 29 Jan 2016 00:57:28 +0800 Subject: [PATCH 01/11] modified app.json to include dev dependicies --- app.json | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/app.json b/app.json index c61acbd..cb49831 100644 --- a/app.json +++ b/app.json @@ -9,6 +9,7 @@ "repository": "https://github.com/pheuter/essential-react", "logo": "https://dl.dropboxusercontent.com/u/1803181/essential-react-logo.png", "env": { - "PRODUCTION": "true" + "PRODUCTION": "true", + "NPM_CONFIG_PRODUCTION": "false" } } From 593a666c998093c81fdd5b0fffe144c1b322d1c8 Mon Sep 17 00:00:00 2001 From: Dylan Date: Sat, 30 Jan 2016 23:57:16 +0800 Subject: [PATCH 02/11] Revert "modified app.json to include dev dependicies" This reverts commit cd38bf4a6f67a5ba4c9472b62ce8c59b9a501349. --- app.json | 3 +-- 1 file changed, 1 insertion(+), 2 deletions(-) diff --git a/app.json b/app.json index cb49831..c61acbd 100644 --- a/app.json +++ b/app.json @@ -9,7 +9,6 @@ "repository": "https://github.com/pheuter/essential-react", "logo": "https://dl.dropboxusercontent.com/u/1803181/essential-react-logo.png", "env": { - "PRODUCTION": "true", - "NPM_CONFIG_PRODUCTION": "false" + "PRODUCTION": "true" } } From b63a7a39d6abede3036ca4b36ca9a8d585a7345d Mon Sep 17 00:00:00 2001 From: Dylan Date: Sun, 31 Jan 2016 00:15:55 +0800 Subject: [PATCH 03/11] added linting for atom --- LICENSE | 4 ++-- build/index.html | 6 +++--- package.json | 4 ++++ server.js | 29 ++++++++++++++--------------- src/common/base.css | 2 +- src/common/components/App.js | 2 +- src/common/components/Routes.js | 4 ++-- src/main.js | 16 +++++++--------- src/pages/home/page.js | 4 ++-- src/pages/login/page.js | 4 ++-- webpack.local.config.js | 16 ++++++++-------- webpack.production.config.js | 8 ++++---- 12 files changed, 50 insertions(+), 49 deletions(-) diff --git a/LICENSE b/LICENSE index 0b261e5..c77ab8d 100644 --- a/LICENSE +++ b/LICENSE @@ -3,7 +3,7 @@ The MIT License (MIT) Copyright (c) 2015 Mark Fayngersh Permission is hereby granted, free of charge, to any person obtaining a copy -of this software and associated documentation files (the "Software"), to deal +of this software and associated documentation files (the 'Software'), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is @@ -12,7 +12,7 @@ furnished to do so, subject to the following conditions: The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software. -THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR +THE SOFTWARE IS PROVIDED 'AS IS', WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER diff --git a/build/index.html b/build/index.html index 5db69b1..e5a2857 100644 --- a/build/index.html +++ b/build/index.html @@ -2,11 +2,11 @@ Essential React Template - + -
+
- + diff --git a/package.json b/package.json index c0ccabb..6036c8c 100644 --- a/package.json +++ b/package.json @@ -30,6 +30,7 @@ "devDependencies": { "autoprefixer": "^6.0.2", "ava": "^0.11.0", + "babel-eslint": "^4.1.6", "babel-loader": "^6.2.1", "babel-plugin-transform-runtime": "^6.4.3", "babel-preset-es2015": "^6.3.13", @@ -39,6 +40,9 @@ "coveralls": "^2.11.2", "css-loader": "^0.18.0", "enzyme": "^1.4.0", + "eslint": "^1.10.3", + "eslint-config-airbnb": "^4.0.0", + "eslint-plugin-react": "^3.16.1", "extract-text-webpack-plugin": "^0.8.2", "nyc": "^5.3.0", "postcss-loader": "^0.6.0", diff --git a/server.js b/server.js index 77515c4..7841c99 100644 --- a/server.js +++ b/server.js @@ -1,4 +1,4 @@ -var express = require('express'); +var express = require("express"); var app = express(); @@ -12,26 +12,25 @@ var app = express(); ************************************************************/ // Serve application file depending on environment -app.get('/app.js', function(req, res) { +app.get("/app.js", function(req, res) { if (process.env.PRODUCTION) { - res.sendFile(__dirname + '/build/app.js'); + res.sendFile(__dirname + "/build/app.js"); } else { - res.redirect('//localhost:9090/build/app.js'); + res.redirect("//localhost:9090/build/app.js"); } }); - // Serve aggregate stylesheet depending on environment -app.get('/style.css', function(req, res) { +app.get("/style.css", function(req, res) { if (process.env.PRODUCTION) { - res.sendFile(__dirname + '/build/style.css'); + res.sendFile(__dirname + "/build/style.css"); } else { - res.redirect('//localhost:9090/build/style.css'); + res.redirect("//localhost:9090/build/style.css"); } }); // Serve index page -app.get('*', function(req, res) { - res.sendFile(__dirname + '/build/index.html'); +app.get("*", function(req, res) { + res.sendFile(__dirname + "/build/index.html"); }); @@ -44,16 +43,16 @@ app.get('*', function(req, res) { *************************************************************/ if (!process.env.PRODUCTION) { - var webpack = require('webpack'); - var WebpackDevServer = require('webpack-dev-server'); - var config = require('./webpack.local.config'); + var webpack = require("webpack"); + var WebpackDevServer = require("webpack-dev-server"); + var config = require("./webpack.local.config"); new WebpackDevServer(webpack(config), { publicPath: config.output.publicPath, hot: true, noInfo: true, historyApiFallback: true - }).listen(9090, 'localhost', function (err, result) { + }).listen(9090, "localhost", function (err, result) { if (err) { console.log(err); } @@ -72,5 +71,5 @@ var server = app.listen(port, function () { var host = server.address().address; var port = server.address().port; - console.log('Essential React listening at http://%s:%s', host, port); + console.log("Essential React listening at http://%s:%s", host, port); }); diff --git a/src/common/base.css b/src/common/base.css index 4c57b9b..eaed95c 100644 --- a/src/common/base.css +++ b/src/common/base.css @@ -4,7 +4,7 @@ body { margin: 0; - font-family: "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif; + font-family: 'HelveticaNeue-Light', 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, Arial, 'Lucida Grande', sans-serif; font-weight: 300; background-color: #f1f1f1; } diff --git a/src/common/components/App.js b/src/common/components/App.js index 8e349f0..4e8043d 100644 --- a/src/common/components/App.js +++ b/src/common/components/App.js @@ -4,7 +4,7 @@ import React from 'react'; export default class App extends React.Component { render() { return ( -
+
{this.props.children}
); diff --git a/src/common/components/Routes.js b/src/common/components/Routes.js index 62b8ae8..96951dc 100644 --- a/src/common/components/Routes.js +++ b/src/common/components/Routes.js @@ -7,8 +7,8 @@ import HomePage from '../../pages/home/page'; export default ( - + - + ); diff --git a/src/main.js b/src/main.js index 1e7d4c9..b5afc86 100644 --- a/src/main.js +++ b/src/main.js @@ -3,25 +3,23 @@ */ // Polyfill -import "babel-polyfill"; +import 'babel-polyfill'; // Libraries -import React from "react"; -import ReactDOM from "react-dom"; -import { Router } from "react-router"; -import createBrowserHistory from 'history/lib/createBrowserHistory' +import React from 'react'; +import ReactDOM from 'react-dom'; +import { Router } from 'react-router'; +import createBrowserHistory from 'history/lib/createBrowserHistory'; // Routes import Routes from './common/components/Routes'; // Base styling -import "./common/base.css"; +import './common/base.css'; // ID of the DOM element to mount app on -const DOM_APP_EL_ID = "app"; - - +const DOM_APP_EL_ID = 'app'; // Render the router ReactDOM.render(( diff --git a/src/pages/home/page.js b/src/pages/home/page.js index 3324c69..c1129aa 100644 --- a/src/pages/home/page.js +++ b/src/pages/home/page.js @@ -1,5 +1,5 @@ -import React from "react"; -import styles from "./style.css"; +import React from 'react'; +import styles from './style.css'; export default class HomePage extends React.Component { diff --git a/src/pages/login/page.js b/src/pages/login/page.js index 598e48c..1175f6b 100644 --- a/src/pages/login/page.js +++ b/src/pages/login/page.js @@ -1,5 +1,5 @@ -import React from "react"; -import styles from "./style.css"; +import React from 'react'; +import styles from './style.css'; export default class LoginPage extends React.Component { diff --git a/webpack.local.config.js b/webpack.local.config.js index 3935b94..2fa28d0 100644 --- a/webpack.local.config.js +++ b/webpack.local.config.js @@ -14,21 +14,21 @@ var ExtractTextPlugin = require('extract-text-webpack-plugin'); module.exports = { // Efficiently evaluate modules with source maps - devtool: "eval", + devtool: 'eval', // Set entry point to ./src/main and include necessary files for hot load entry: [ - "webpack-dev-server/client?http://localhost:9090", - "webpack/hot/only-dev-server", - "./src/main" + 'webpack-dev-server/client?http://localhost:9090', + 'webpack/hot/only-dev-server', + './src/main' ], // This will not actually create a bundle.js file in ./build. It is used // by the dev server for dynamic hot loading. output: { - path: __dirname + "/build/", - filename: "app.js", - publicPath: "http://localhost:9090/build/" + path: __dirname + '/build/', + filename: 'app.js', + publicPath: 'http://localhost:9090/build/' }, // Necessary plugins for hot load @@ -41,7 +41,7 @@ module.exports = { // Transform source code using Babel and React Hot Loader module: { loaders: [ - { test: /\.jsx?$/, exclude: /node_modules/, loaders: ["react-hot", "babel-loader?presets[]=es2015,presets[]=react,presets[]=stage-0,plugins[]=transform-runtime"] }, + { test: /\.jsx?$/, exclude: /node_modules/, loaders: ['react-hot', 'babel-loader?presets[]=es2015,presets[]=react,presets[]=stage-0,plugins[]=transform-runtime'] }, { test: /\.css$/, loader: ExtractTextPlugin.extract('style-loader', 'css-loader?modules&importLoaders=1&localIdentName=[name]__[local]___[hash:base64:5]!postcss-loader') } ] }, diff --git a/webpack.production.config.js b/webpack.production.config.js index 14d96f8..155c6eb 100644 --- a/webpack.production.config.js +++ b/webpack.production.config.js @@ -5,11 +5,11 @@ var ExtractTextPlugin = require('extract-text-webpack-plugin'); * This is the Webpack configuration file for production. */ module.exports = { - entry: "./src/main", + entry: './src/main', output: { - path: __dirname + "/build/", - filename: "app.js" + path: __dirname + '/build/', + filename: 'app.js' }, plugins: [ @@ -18,7 +18,7 @@ module.exports = { module: { loaders: [ - { test: /\.jsx?$/, exclude: /node_modules/, loader: "babel-loader?presets[]=es2015,presets[]=react,presets[]=stage-0,plugins[]=transform-runtime" }, + { test: /\.jsx?$/, exclude: /node_modules/, loader: 'babel-loader?presets[]=es2015,presets[]=react,presets[]=stage-0,plugins[]=transform-runtime' }, { test: /\.css$/, loader: ExtractTextPlugin.extract('style-loader', 'css-loader?modules&importLoaders=1&localIdentName=[name]__[local]___[hash:base64:5]!postcss-loader') } ] }, From beed134733f15736209217fd60c56062a54f88a2 Mon Sep 17 00:00:00 2001 From: Dylan Date: Sun, 31 Jan 2016 00:17:13 +0800 Subject: [PATCH 04/11] Revert "added linting for atom" This reverts commit b63a7a39d6abede3036ca4b36ca9a8d585a7345d. --- LICENSE | 4 ++-- build/index.html | 6 +++--- package.json | 4 ---- server.js | 29 +++++++++++++++-------------- src/common/base.css | 2 +- src/common/components/App.js | 2 +- src/common/components/Routes.js | 4 ++-- src/main.js | 16 +++++++++------- src/pages/home/page.js | 4 ++-- src/pages/login/page.js | 4 ++-- webpack.local.config.js | 16 ++++++++-------- webpack.production.config.js | 8 ++++---- 12 files changed, 49 insertions(+), 50 deletions(-) diff --git a/LICENSE b/LICENSE index c77ab8d..0b261e5 100644 --- a/LICENSE +++ b/LICENSE @@ -3,7 +3,7 @@ The MIT License (MIT) Copyright (c) 2015 Mark Fayngersh Permission is hereby granted, free of charge, to any person obtaining a copy -of this software and associated documentation files (the 'Software'), to deal +of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is @@ -12,7 +12,7 @@ furnished to do so, subject to the following conditions: The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software. -THE SOFTWARE IS PROVIDED 'AS IS', WITHOUT WARRANTY OF ANY KIND, EXPRESS OR +THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER diff --git a/build/index.html b/build/index.html index e5a2857..5db69b1 100644 --- a/build/index.html +++ b/build/index.html @@ -2,11 +2,11 @@ Essential React Template - + -
+
- + diff --git a/package.json b/package.json index 6036c8c..c0ccabb 100644 --- a/package.json +++ b/package.json @@ -30,7 +30,6 @@ "devDependencies": { "autoprefixer": "^6.0.2", "ava": "^0.11.0", - "babel-eslint": "^4.1.6", "babel-loader": "^6.2.1", "babel-plugin-transform-runtime": "^6.4.3", "babel-preset-es2015": "^6.3.13", @@ -40,9 +39,6 @@ "coveralls": "^2.11.2", "css-loader": "^0.18.0", "enzyme": "^1.4.0", - "eslint": "^1.10.3", - "eslint-config-airbnb": "^4.0.0", - "eslint-plugin-react": "^3.16.1", "extract-text-webpack-plugin": "^0.8.2", "nyc": "^5.3.0", "postcss-loader": "^0.6.0", diff --git a/server.js b/server.js index 7841c99..77515c4 100644 --- a/server.js +++ b/server.js @@ -1,4 +1,4 @@ -var express = require("express"); +var express = require('express'); var app = express(); @@ -12,25 +12,26 @@ var app = express(); ************************************************************/ // Serve application file depending on environment -app.get("/app.js", function(req, res) { +app.get('/app.js', function(req, res) { if (process.env.PRODUCTION) { - res.sendFile(__dirname + "/build/app.js"); + res.sendFile(__dirname + '/build/app.js'); } else { - res.redirect("//localhost:9090/build/app.js"); + res.redirect('//localhost:9090/build/app.js'); } }); + // Serve aggregate stylesheet depending on environment -app.get("/style.css", function(req, res) { +app.get('/style.css', function(req, res) { if (process.env.PRODUCTION) { - res.sendFile(__dirname + "/build/style.css"); + res.sendFile(__dirname + '/build/style.css'); } else { - res.redirect("//localhost:9090/build/style.css"); + res.redirect('//localhost:9090/build/style.css'); } }); // Serve index page -app.get("*", function(req, res) { - res.sendFile(__dirname + "/build/index.html"); +app.get('*', function(req, res) { + res.sendFile(__dirname + '/build/index.html'); }); @@ -43,16 +44,16 @@ app.get("*", function(req, res) { *************************************************************/ if (!process.env.PRODUCTION) { - var webpack = require("webpack"); - var WebpackDevServer = require("webpack-dev-server"); - var config = require("./webpack.local.config"); + var webpack = require('webpack'); + var WebpackDevServer = require('webpack-dev-server'); + var config = require('./webpack.local.config'); new WebpackDevServer(webpack(config), { publicPath: config.output.publicPath, hot: true, noInfo: true, historyApiFallback: true - }).listen(9090, "localhost", function (err, result) { + }).listen(9090, 'localhost', function (err, result) { if (err) { console.log(err); } @@ -71,5 +72,5 @@ var server = app.listen(port, function () { var host = server.address().address; var port = server.address().port; - console.log("Essential React listening at http://%s:%s", host, port); + console.log('Essential React listening at http://%s:%s', host, port); }); diff --git a/src/common/base.css b/src/common/base.css index eaed95c..4c57b9b 100644 --- a/src/common/base.css +++ b/src/common/base.css @@ -4,7 +4,7 @@ body { margin: 0; - font-family: 'HelveticaNeue-Light', 'Helvetica Neue Light', 'Helvetica Neue', Helvetica, Arial, 'Lucida Grande', sans-serif; + font-family: "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif; font-weight: 300; background-color: #f1f1f1; } diff --git a/src/common/components/App.js b/src/common/components/App.js index 4e8043d..8e349f0 100644 --- a/src/common/components/App.js +++ b/src/common/components/App.js @@ -4,7 +4,7 @@ import React from 'react'; export default class App extends React.Component { render() { return ( -
+
{this.props.children}
); diff --git a/src/common/components/Routes.js b/src/common/components/Routes.js index 96951dc..62b8ae8 100644 --- a/src/common/components/Routes.js +++ b/src/common/components/Routes.js @@ -7,8 +7,8 @@ import HomePage from '../../pages/home/page'; export default ( - + - + ); diff --git a/src/main.js b/src/main.js index b5afc86..1e7d4c9 100644 --- a/src/main.js +++ b/src/main.js @@ -3,23 +3,25 @@ */ // Polyfill -import 'babel-polyfill'; +import "babel-polyfill"; // Libraries -import React from 'react'; -import ReactDOM from 'react-dom'; -import { Router } from 'react-router'; -import createBrowserHistory from 'history/lib/createBrowserHistory'; +import React from "react"; +import ReactDOM from "react-dom"; +import { Router } from "react-router"; +import createBrowserHistory from 'history/lib/createBrowserHistory' // Routes import Routes from './common/components/Routes'; // Base styling -import './common/base.css'; +import "./common/base.css"; // ID of the DOM element to mount app on -const DOM_APP_EL_ID = 'app'; +const DOM_APP_EL_ID = "app"; + + // Render the router ReactDOM.render(( diff --git a/src/pages/home/page.js b/src/pages/home/page.js index c1129aa..3324c69 100644 --- a/src/pages/home/page.js +++ b/src/pages/home/page.js @@ -1,5 +1,5 @@ -import React from 'react'; -import styles from './style.css'; +import React from "react"; +import styles from "./style.css"; export default class HomePage extends React.Component { diff --git a/src/pages/login/page.js b/src/pages/login/page.js index 1175f6b..598e48c 100644 --- a/src/pages/login/page.js +++ b/src/pages/login/page.js @@ -1,5 +1,5 @@ -import React from 'react'; -import styles from './style.css'; +import React from "react"; +import styles from "./style.css"; export default class LoginPage extends React.Component { diff --git a/webpack.local.config.js b/webpack.local.config.js index 2fa28d0..3935b94 100644 --- a/webpack.local.config.js +++ b/webpack.local.config.js @@ -14,21 +14,21 @@ var ExtractTextPlugin = require('extract-text-webpack-plugin'); module.exports = { // Efficiently evaluate modules with source maps - devtool: 'eval', + devtool: "eval", // Set entry point to ./src/main and include necessary files for hot load entry: [ - 'webpack-dev-server/client?http://localhost:9090', - 'webpack/hot/only-dev-server', - './src/main' + "webpack-dev-server/client?http://localhost:9090", + "webpack/hot/only-dev-server", + "./src/main" ], // This will not actually create a bundle.js file in ./build. It is used // by the dev server for dynamic hot loading. output: { - path: __dirname + '/build/', - filename: 'app.js', - publicPath: 'http://localhost:9090/build/' + path: __dirname + "/build/", + filename: "app.js", + publicPath: "http://localhost:9090/build/" }, // Necessary plugins for hot load @@ -41,7 +41,7 @@ module.exports = { // Transform source code using Babel and React Hot Loader module: { loaders: [ - { test: /\.jsx?$/, exclude: /node_modules/, loaders: ['react-hot', 'babel-loader?presets[]=es2015,presets[]=react,presets[]=stage-0,plugins[]=transform-runtime'] }, + { test: /\.jsx?$/, exclude: /node_modules/, loaders: ["react-hot", "babel-loader?presets[]=es2015,presets[]=react,presets[]=stage-0,plugins[]=transform-runtime"] }, { test: /\.css$/, loader: ExtractTextPlugin.extract('style-loader', 'css-loader?modules&importLoaders=1&localIdentName=[name]__[local]___[hash:base64:5]!postcss-loader') } ] }, diff --git a/webpack.production.config.js b/webpack.production.config.js index 155c6eb..14d96f8 100644 --- a/webpack.production.config.js +++ b/webpack.production.config.js @@ -5,11 +5,11 @@ var ExtractTextPlugin = require('extract-text-webpack-plugin'); * This is the Webpack configuration file for production. */ module.exports = { - entry: './src/main', + entry: "./src/main", output: { - path: __dirname + '/build/', - filename: 'app.js' + path: __dirname + "/build/", + filename: "app.js" }, plugins: [ @@ -18,7 +18,7 @@ module.exports = { module: { loaders: [ - { test: /\.jsx?$/, exclude: /node_modules/, loader: 'babel-loader?presets[]=es2015,presets[]=react,presets[]=stage-0,plugins[]=transform-runtime' }, + { test: /\.jsx?$/, exclude: /node_modules/, loader: "babel-loader?presets[]=es2015,presets[]=react,presets[]=stage-0,plugins[]=transform-runtime" }, { test: /\.css$/, loader: ExtractTextPlugin.extract('style-loader', 'css-loader?modules&importLoaders=1&localIdentName=[name]__[local]___[hash:base64:5]!postcss-loader') } ] }, From 10655ebececdb741da086d29fa6a5c2be65be79d Mon Sep 17 00:00:00 2001 From: Dylan Date: Sun, 31 Jan 2016 00:25:09 +0800 Subject: [PATCH 05/11] added airbnb linting --- package.json | 4 ++++ src/common/components/App.js | 2 +- src/common/components/Routes.js | 4 ++-- src/main.js | 16 +++++++--------- src/pages/home/page.js | 4 ++-- src/pages/login/page.js | 4 ++-- webpack.local.config.js | 16 ++++++++-------- webpack.production.config.js | 8 ++++---- 8 files changed, 30 insertions(+), 28 deletions(-) diff --git a/package.json b/package.json index c0ccabb..6036c8c 100644 --- a/package.json +++ b/package.json @@ -30,6 +30,7 @@ "devDependencies": { "autoprefixer": "^6.0.2", "ava": "^0.11.0", + "babel-eslint": "^4.1.6", "babel-loader": "^6.2.1", "babel-plugin-transform-runtime": "^6.4.3", "babel-preset-es2015": "^6.3.13", @@ -39,6 +40,9 @@ "coveralls": "^2.11.2", "css-loader": "^0.18.0", "enzyme": "^1.4.0", + "eslint": "^1.10.3", + "eslint-config-airbnb": "^4.0.0", + "eslint-plugin-react": "^3.16.1", "extract-text-webpack-plugin": "^0.8.2", "nyc": "^5.3.0", "postcss-loader": "^0.6.0", diff --git a/src/common/components/App.js b/src/common/components/App.js index 8e349f0..4e8043d 100644 --- a/src/common/components/App.js +++ b/src/common/components/App.js @@ -4,7 +4,7 @@ import React from 'react'; export default class App extends React.Component { render() { return ( -
+
{this.props.children}
); diff --git a/src/common/components/Routes.js b/src/common/components/Routes.js index 62b8ae8..96951dc 100644 --- a/src/common/components/Routes.js +++ b/src/common/components/Routes.js @@ -7,8 +7,8 @@ import HomePage from '../../pages/home/page'; export default ( - + - + ); diff --git a/src/main.js b/src/main.js index 1e7d4c9..b5afc86 100644 --- a/src/main.js +++ b/src/main.js @@ -3,25 +3,23 @@ */ // Polyfill -import "babel-polyfill"; +import 'babel-polyfill'; // Libraries -import React from "react"; -import ReactDOM from "react-dom"; -import { Router } from "react-router"; -import createBrowserHistory from 'history/lib/createBrowserHistory' +import React from 'react'; +import ReactDOM from 'react-dom'; +import { Router } from 'react-router'; +import createBrowserHistory from 'history/lib/createBrowserHistory'; // Routes import Routes from './common/components/Routes'; // Base styling -import "./common/base.css"; +import './common/base.css'; // ID of the DOM element to mount app on -const DOM_APP_EL_ID = "app"; - - +const DOM_APP_EL_ID = 'app'; // Render the router ReactDOM.render(( diff --git a/src/pages/home/page.js b/src/pages/home/page.js index 3324c69..c1129aa 100644 --- a/src/pages/home/page.js +++ b/src/pages/home/page.js @@ -1,5 +1,5 @@ -import React from "react"; -import styles from "./style.css"; +import React from 'react'; +import styles from './style.css'; export default class HomePage extends React.Component { diff --git a/src/pages/login/page.js b/src/pages/login/page.js index 598e48c..1175f6b 100644 --- a/src/pages/login/page.js +++ b/src/pages/login/page.js @@ -1,5 +1,5 @@ -import React from "react"; -import styles from "./style.css"; +import React from 'react'; +import styles from './style.css'; export default class LoginPage extends React.Component { diff --git a/webpack.local.config.js b/webpack.local.config.js index 3935b94..2fa28d0 100644 --- a/webpack.local.config.js +++ b/webpack.local.config.js @@ -14,21 +14,21 @@ var ExtractTextPlugin = require('extract-text-webpack-plugin'); module.exports = { // Efficiently evaluate modules with source maps - devtool: "eval", + devtool: 'eval', // Set entry point to ./src/main and include necessary files for hot load entry: [ - "webpack-dev-server/client?http://localhost:9090", - "webpack/hot/only-dev-server", - "./src/main" + 'webpack-dev-server/client?http://localhost:9090', + 'webpack/hot/only-dev-server', + './src/main' ], // This will not actually create a bundle.js file in ./build. It is used // by the dev server for dynamic hot loading. output: { - path: __dirname + "/build/", - filename: "app.js", - publicPath: "http://localhost:9090/build/" + path: __dirname + '/build/', + filename: 'app.js', + publicPath: 'http://localhost:9090/build/' }, // Necessary plugins for hot load @@ -41,7 +41,7 @@ module.exports = { // Transform source code using Babel and React Hot Loader module: { loaders: [ - { test: /\.jsx?$/, exclude: /node_modules/, loaders: ["react-hot", "babel-loader?presets[]=es2015,presets[]=react,presets[]=stage-0,plugins[]=transform-runtime"] }, + { test: /\.jsx?$/, exclude: /node_modules/, loaders: ['react-hot', 'babel-loader?presets[]=es2015,presets[]=react,presets[]=stage-0,plugins[]=transform-runtime'] }, { test: /\.css$/, loader: ExtractTextPlugin.extract('style-loader', 'css-loader?modules&importLoaders=1&localIdentName=[name]__[local]___[hash:base64:5]!postcss-loader') } ] }, diff --git a/webpack.production.config.js b/webpack.production.config.js index 14d96f8..155c6eb 100644 --- a/webpack.production.config.js +++ b/webpack.production.config.js @@ -5,11 +5,11 @@ var ExtractTextPlugin = require('extract-text-webpack-plugin'); * This is the Webpack configuration file for production. */ module.exports = { - entry: "./src/main", + entry: './src/main', output: { - path: __dirname + "/build/", - filename: "app.js" + path: __dirname + '/build/', + filename: 'app.js' }, plugins: [ @@ -18,7 +18,7 @@ module.exports = { module: { loaders: [ - { test: /\.jsx?$/, exclude: /node_modules/, loader: "babel-loader?presets[]=es2015,presets[]=react,presets[]=stage-0,plugins[]=transform-runtime" }, + { test: /\.jsx?$/, exclude: /node_modules/, loader: 'babel-loader?presets[]=es2015,presets[]=react,presets[]=stage-0,plugins[]=transform-runtime' }, { test: /\.css$/, loader: ExtractTextPlugin.extract('style-loader', 'css-loader?modules&importLoaders=1&localIdentName=[name]__[local]___[hash:base64:5]!postcss-loader') } ] }, From a8936c1466bde60dfa241e546e63dd164db175a8 Mon Sep 17 00:00:00 2001 From: Dylan Date: Sun, 31 Jan 2016 00:25:29 +0800 Subject: [PATCH 06/11] added airbnb linting --- .eslintignore | 1 + .eslintrc | 12 ++++++++++++ 2 files changed, 13 insertions(+) create mode 100644 .eslintignore create mode 100644 .eslintrc diff --git a/.eslintignore b/.eslintignore new file mode 100644 index 0000000..99f609a --- /dev/null +++ b/.eslintignore @@ -0,0 +1 @@ +./server.js diff --git a/.eslintrc b/.eslintrc new file mode 100644 index 0000000..8b7f197 --- /dev/null +++ b/.eslintrc @@ -0,0 +1,12 @@ + +{ + 'parser': 'babel-eslint', + 'extends': 'airbnb', + 'globals': { + '__DEV__': true + }, + 'rules': { + 'react/jsx-quotes': 0, + 'jsx-quotes': [2, 'prefer-double'] + } +} From 4eaf4fbedf6e335dd9ba569fefd8c35e62d17fb2 Mon Sep 17 00:00:00 2001 From: Dylan Date: Sun, 31 Jan 2016 00:31:28 +0800 Subject: [PATCH 07/11] checked for all errors --- server.js | 28 ++++++++++++++-------------- src/common/components/App.js | 5 ++++- src/common/components/Routes.js | 4 ++-- 3 files changed, 20 insertions(+), 17 deletions(-) diff --git a/server.js b/server.js index 77515c4..8d39154 100644 --- a/server.js +++ b/server.js @@ -1,4 +1,4 @@ -var express = require('express'); +var express = require("express"); var app = express(); @@ -12,26 +12,26 @@ var app = express(); ************************************************************/ // Serve application file depending on environment -app.get('/app.js', function(req, res) { +app.get("/app.js", function(req, res) { if (process.env.PRODUCTION) { - res.sendFile(__dirname + '/build/app.js'); + res.sendFile(__dirname + "/build/app.js"); } else { - res.redirect('//localhost:9090/build/app.js'); + res.redirect("//localhost:9090/build/app.js"); } }); // Serve aggregate stylesheet depending on environment -app.get('/style.css', function(req, res) { +app.get("/style.css", function(req, res) { if (process.env.PRODUCTION) { - res.sendFile(__dirname + '/build/style.css'); + res.sendFile(__dirname + "/build/style.css"); } else { - res.redirect('//localhost:9090/build/style.css'); + res.redirect("//localhost:9090/build/style.css"); } }); // Serve index page -app.get('*', function(req, res) { - res.sendFile(__dirname + '/build/index.html'); +app.get("*", function(req, res) { + res.sendFile(__dirname + "/build/index.html"); }); @@ -44,16 +44,16 @@ app.get('*', function(req, res) { *************************************************************/ if (!process.env.PRODUCTION) { - var webpack = require('webpack'); - var WebpackDevServer = require('webpack-dev-server'); - var config = require('./webpack.local.config'); + var webpack = require("webpack"); + var WebpackDevServer = require("webpack-dev-server"); + var config = require("./webpack.local.config"); new WebpackDevServer(webpack(config), { publicPath: config.output.publicPath, hot: true, noInfo: true, historyApiFallback: true - }).listen(9090, 'localhost', function (err, result) { + }).listen(9090, "localhost", function (err, result) { if (err) { console.log(err); } @@ -72,5 +72,5 @@ var server = app.listen(port, function () { var host = server.address().address; var port = server.address().port; - console.log('Essential React listening at http://%s:%s', host, port); + console.log("Essential React listening at http://%s:%s", host, port); }); diff --git a/src/common/components/App.js b/src/common/components/App.js index 4e8043d..f126cc6 100644 --- a/src/common/components/App.js +++ b/src/common/components/App.js @@ -2,9 +2,12 @@ import React from 'react'; export default class App extends React.Component { + static propTypes = { + children: React.PropTypes.element.isRequired, + } render() { return ( -
+
{this.props.children}
); diff --git a/src/common/components/Routes.js b/src/common/components/Routes.js index 96951dc..62b8ae8 100644 --- a/src/common/components/Routes.js +++ b/src/common/components/Routes.js @@ -7,8 +7,8 @@ import HomePage from '../../pages/home/page'; export default ( - + - + ); From e4f1c2d9ba0a3951fcc019c93d04c68b9b0bb3f7 Mon Sep 17 00:00:00 2001 From: Dylan Date: Sun, 31 Jan 2016 00:36:17 +0800 Subject: [PATCH 08/11] simpler lint settings --- package.json | 1 - 1 file changed, 1 deletion(-) diff --git a/package.json b/package.json index 6036c8c..f7ff01a 100644 --- a/package.json +++ b/package.json @@ -41,7 +41,6 @@ "css-loader": "^0.18.0", "enzyme": "^1.4.0", "eslint": "^1.10.3", - "eslint-config-airbnb": "^4.0.0", "eslint-plugin-react": "^3.16.1", "extract-text-webpack-plugin": "^0.8.2", "nyc": "^5.3.0", From ebe28dda35e29c21f431b0ce6f94c7a7a93836b3 Mon Sep 17 00:00:00 2001 From: Dylan Date: Sun, 31 Jan 2016 00:39:19 +0800 Subject: [PATCH 09/11] Revert "simpler lint settings" This reverts commit e4f1c2d9ba0a3951fcc019c93d04c68b9b0bb3f7. --- package.json | 1 + 1 file changed, 1 insertion(+) diff --git a/package.json b/package.json index f7ff01a..6036c8c 100644 --- a/package.json +++ b/package.json @@ -41,6 +41,7 @@ "css-loader": "^0.18.0", "enzyme": "^1.4.0", "eslint": "^1.10.3", + "eslint-config-airbnb": "^4.0.0", "eslint-plugin-react": "^3.16.1", "extract-text-webpack-plugin": "^0.8.2", "nyc": "^5.3.0", From a5e0f0d20da31874debecb751a412642d0615af5 Mon Sep 17 00:00:00 2001 From: Dylan Date: Sun, 31 Jan 2016 01:01:53 +0800 Subject: [PATCH 10/11] fixed error, linter didnt pick up on it... --- src/common/components/App.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/common/components/App.js b/src/common/components/App.js index f126cc6..7759503 100644 --- a/src/common/components/App.js +++ b/src/common/components/App.js @@ -4,7 +4,7 @@ import React from 'react'; export default class App extends React.Component { static propTypes = { children: React.PropTypes.element.isRequired, - } + }; render() { return (
From 45b6d3e906da1951ebf3168019c135055ec805e7 Mon Sep 17 00:00:00 2001 From: Dylan Date: Sun, 31 Jan 2016 01:34:05 +0800 Subject: [PATCH 11/11] using ugly es6 syntax --- src/common/components/App.js | 8 +++++++- 1 file changed, 7 insertions(+), 1 deletion(-) diff --git a/src/common/components/App.js b/src/common/components/App.js index 7759503..244da12 100644 --- a/src/common/components/App.js +++ b/src/common/components/App.js @@ -1,7 +1,7 @@ import React from 'react'; -export default class App extends React.Component { +class App extends React.Component { static propTypes = { children: React.PropTypes.element.isRequired, }; @@ -13,3 +13,9 @@ export default class App extends React.Component { ); } } + +App.propTypes = { + title: React.PropTypes.string.isRequired, +}; + +export default App;