From dcdd5ac31df7a1b79b929c962c54d2d0e9014969 Mon Sep 17 00:00:00 2001 From: Ivar Date: Sun, 11 Sep 2016 21:54:31 +0200 Subject: [PATCH] Setup react, webpack, babel, hmr etc #153 --- packages/unleash-frontend-next/.babelrc | 8 +++ packages/unleash-frontend-next/.eslintrc | 6 ++ packages/unleash-frontend-next/index.html | 11 ++++ .../jest-preprocessor.js | 9 +++ packages/unleash-frontend-next/package.json | 64 +++++++++++++++++++ packages/unleash-frontend-next/server.js | 16 +++++ packages/unleash-frontend-next/src/App.jsx | 9 +++ packages/unleash-frontend-next/src/index.js | 7 ++ .../unleash-frontend-next/webpack.config.js | 48 ++++++++++++++ 9 files changed, 178 insertions(+) create mode 100644 packages/unleash-frontend-next/.babelrc create mode 100644 packages/unleash-frontend-next/.eslintrc create mode 100644 packages/unleash-frontend-next/index.html create mode 100644 packages/unleash-frontend-next/jest-preprocessor.js create mode 100644 packages/unleash-frontend-next/package.json create mode 100644 packages/unleash-frontend-next/server.js create mode 100644 packages/unleash-frontend-next/src/App.jsx create mode 100644 packages/unleash-frontend-next/src/index.js create mode 100644 packages/unleash-frontend-next/webpack.config.js diff --git a/packages/unleash-frontend-next/.babelrc b/packages/unleash-frontend-next/.babelrc new file mode 100644 index 0000000000..add9397672 --- /dev/null +++ b/packages/unleash-frontend-next/.babelrc @@ -0,0 +1,8 @@ +{ + "presets": ["react", "es2015", "stage-0"], + "env": { + "development": { + "presets": ["react-hmre"] + } + } +} diff --git a/packages/unleash-frontend-next/.eslintrc b/packages/unleash-frontend-next/.eslintrc new file mode 100644 index 0000000000..8f68bb4a87 --- /dev/null +++ b/packages/unleash-frontend-next/.eslintrc @@ -0,0 +1,6 @@ +{ + "extends": [ + "finn", + "finn/node" + ] +} diff --git a/packages/unleash-frontend-next/index.html b/packages/unleash-frontend-next/index.html new file mode 100644 index 0000000000..13b2b447c5 --- /dev/null +++ b/packages/unleash-frontend-next/index.html @@ -0,0 +1,11 @@ + + + + Sample App + + +
+
+ + + diff --git a/packages/unleash-frontend-next/jest-preprocessor.js b/packages/unleash-frontend-next/jest-preprocessor.js new file mode 100644 index 0000000000..66c8d10d00 --- /dev/null +++ b/packages/unleash-frontend-next/jest-preprocessor.js @@ -0,0 +1,9 @@ +// preprocessor.js +'use strict'; + +const ReactTools = require('react-tools'); +module.exports = { + process (src) { + return ReactTools.transform(src); + }, +}; diff --git a/packages/unleash-frontend-next/package.json b/packages/unleash-frontend-next/package.json new file mode 100644 index 0000000000..da27757e90 --- /dev/null +++ b/packages/unleash-frontend-next/package.json @@ -0,0 +1,64 @@ +{ + "name": "unleash-frontend", + "description": "unleash your features", + "version": "1.0.0-alpha.2", + "keywords": [ + "unleash", + "feature toggle", + "feature", + "toggle" + ], + "files": [ + "public" + ], + "repository": { + "type": "git", + "url": "ssh://git@github.com:finn-no/unleash.git" + }, + "bugs": { + "url": "https://github.com/finn-no/unleash/issues" + }, + "engines": { + "node": "6" + }, + "scripts": { + "build": "webpack -p", + "start": "NODE_ENV=development node server", + "hot-dev-server": "webpack-dev-server --config webpack-hot-dev-server.config.js --hot --progress --colors --port 3000 --inline", + "test": "jest", + "test:ci": "npm run test" + }, + "main": "./lib/index.js", + "dependencies": { + "react": "^15.3.1", + "react-dom": "^15.3.1", + "react-router": "^2.8.0" + }, + "devDependencies": { + "babel-core": "^6.14.0", + "babel-loader": "^6.2.5", + "babel-preset-es2015": "^6.14.0", + "babel-preset-react": "^6.11.1", + "babel-preset-react-hmre": "^1.1.1", + "babel-preset-stage-0": "^6.5.0", + "webpack": "^1.13.2", + "webpack-dev-server": "^1.15.1" + }, + "jest": { + "scriptPreprocessor": "/jest-preprocessor.js", + "modulePathIgnorePatterns": [ + "/node_modules/npm" + ], + "unmockedModulePathPatterns": [ + "/node_modules/react", + "/node_modules/reflux" + ], + "moduleFileExtensions": [ + "jsx", + "js" + ] + }, + "pre-commit": [ + "lint" + ] +} diff --git a/packages/unleash-frontend-next/server.js b/packages/unleash-frontend-next/server.js new file mode 100644 index 0000000000..bde4356bad --- /dev/null +++ b/packages/unleash-frontend-next/server.js @@ -0,0 +1,16 @@ +'use strict'; +const webpack = require('webpack'); +const WebpackDevServer = require('webpack-dev-server'); +const config = require('./webpack.config'); + +new WebpackDevServer(webpack(config), { + colors: true, + publicPath: config.output.publicPath, + hot: true, + historyApiFallback: true, +}).listen(3000, 'localhost', (err) => { + if (err) { + return console.log(err); + } + console.log('Listening at http://localhost:3000/'); +}); diff --git a/packages/unleash-frontend-next/src/App.jsx b/packages/unleash-frontend-next/src/App.jsx new file mode 100644 index 0000000000..5de2c5a813 --- /dev/null +++ b/packages/unleash-frontend-next/src/App.jsx @@ -0,0 +1,9 @@ +import React, { Component } from 'react'; + +export default class App extends Component { + render() { + return ( +

Hello, world

+ ); + } +} diff --git a/packages/unleash-frontend-next/src/index.js b/packages/unleash-frontend-next/src/index.js new file mode 100644 index 0000000000..1a496ffac1 --- /dev/null +++ b/packages/unleash-frontend-next/src/index.js @@ -0,0 +1,7 @@ +'use strict'; + +import React from 'react'; +import ReactDOM from 'react-dom'; +import App from './App'; + +ReactDOM.render(, document.getElementById('root')); diff --git a/packages/unleash-frontend-next/webpack.config.js b/packages/unleash-frontend-next/webpack.config.js new file mode 100644 index 0000000000..935d110e07 --- /dev/null +++ b/packages/unleash-frontend-next/webpack.config.js @@ -0,0 +1,48 @@ +// docs: http://webpack.github.io/docs/configuration.html + +'use strict'; + +const path = require('path'); +const webpack = require('webpack'); + +module.exports = { + entry: [ + 'webpack-dev-server/client?http://localhost:3000', + 'webpack/hot/only-dev-server', + './src/index', + ], + + resolve: { + root: [path.join(__dirname, 'src')], + extensions: ['', '.js', '.jsx'], + modulesDirectories: ['web_modules', 'node_modules'], + }, + + output: { + path: path.join(__dirname, 'dist'), + filename: 'bundle.js', + publicPath: '/static/', + }, + + module: { + loaders: [ + { + test: /\.jsx?$/, + exclude: /node_modules/, + loaders: ['babel'], + include: path.join(__dirname, 'src'), + }, + ], + }, + + plugins: [ + new webpack.HotModuleReplacementPlugin(), + ], + + devtool: 'source-map', + + externals: { + // stuff not in node_modules can be resolved here. + }, + +};