From d6570c5045185049d3b0fe5b467f26feadbb00f1 Mon Sep 17 00:00:00 2001 From: Antti Pilto Date: Wed, 27 Jul 2016 20:13:08 +0300 Subject: [PATCH] boilerplate --- .babelrc | 3 ++ .env.example | 2 ++ .gitignore | 6 ++++ package.json | 28 ++++++++++++++-- src/components/App/App.jsx | 11 +++++++ src/index.html | 14 ++++++++ src/index.js | 6 ++++ webpack.config.js | 55 +++++++++++++++++++++++++++++++ webpack.config.prod.js | 66 ++++++++++++++++++++++++++++++++++++++ 9 files changed, 189 insertions(+), 2 deletions(-) create mode 100644 .babelrc create mode 100644 .env.example create mode 100644 .gitignore create mode 100644 src/components/App/App.jsx create mode 100644 src/index.html create mode 100644 src/index.js create mode 100644 webpack.config.js create mode 100644 webpack.config.prod.js diff --git a/.babelrc b/.babelrc new file mode 100644 index 0000000..994a673 --- /dev/null +++ b/.babelrc @@ -0,0 +1,3 @@ +{ + "presets" : ["es2015", "react"] +} \ No newline at end of file diff --git a/.env.example b/.env.example new file mode 100644 index 0000000..3d5770c --- /dev/null +++ b/.env.example @@ -0,0 +1,2 @@ +AUTH0_CLIENT_ID='BUIJSW9x60sIHBw8Kd9EmCbj8eDIFxDC' +AUTH0_DOMAIN='samples.auth0.com' diff --git a/.gitignore b/.gitignore new file mode 100644 index 0000000..c109e9e --- /dev/null +++ b/.gitignore @@ -0,0 +1,6 @@ +/node_modules/ +/dist/ +/dev_content/ +/index.html +deldist.bat +.env diff --git a/package.json b/package.json index 6396b36..e2e3599 100644 --- a/package.json +++ b/package.json @@ -4,7 +4,9 @@ "description": "Application for studying hiragana & katakana characters.", "main": "index.js", "scripts": { - "test": "echo \"Error: no test specified\" && exit 1" + "test": "echo \"Error: no test specified\" && exit 1", + "start": "webpack-dev-server --host 0.0.0.0", + "build": "webpack -p --config webpack.config.prod.js" }, "repository": { "type": "git", @@ -15,5 +17,27 @@ "bugs": { "url": "https://github.com/anzzstuff/kanaquiz/issues" }, - "homepage": "https://github.com/anzzstuff/kanaquiz#readme" + "homepage": "https://github.com/anzzstuff/kanaquiz#readme", + "devDependencies": { + "autoprefixer": "^6.3.7", + "babel-loader": "^6.2.4", + "babel-preset-es2015": "^6.9.0", + "babel-preset-react": "^6.11.1", + "css-loader": "^0.23.1", + "file-loader": "^0.9.0", + "html-webpack-plugin": "^2.22.0", + "postcss": "^5.0.21", + "postcss-loader": "^0.9.1", + "precss": "^1.4.0", + "react-hot-loader": "^1.3.0", + "style-loader": "^0.13.1", + "url-loader": "^0.5.7", + "webpack": "^1.13.1", + "webpack-dev-server": "^1.14.1" + }, + "dependencies": { + "postcss": "^5.1.0", + "react": "^15.2.1", + "react-dom": "^15.2.1" + } } diff --git a/src/components/App/App.jsx b/src/components/App/App.jsx new file mode 100644 index 0000000..fa98faf --- /dev/null +++ b/src/components/App/App.jsx @@ -0,0 +1,11 @@ +import React, { Component } from 'react'; + +class App extends Component { + render() { + return ( +
hello world
+ ) + } +} + +export default App; \ No newline at end of file diff --git a/src/index.html b/src/index.html new file mode 100644 index 0000000..1ae0411 --- /dev/null +++ b/src/index.html @@ -0,0 +1,14 @@ + + + + Kana Quiz 2: Learn hiragana & katakana fast and easy + + + + + + + +
+ + \ No newline at end of file diff --git a/src/index.js b/src/index.js new file mode 100644 index 0000000..491a90f --- /dev/null +++ b/src/index.js @@ -0,0 +1,6 @@ +import React from 'react'; +import { render } from 'react-dom'; +import App from './components/App/App'; + +let element = React.createElement(App, {}); +render(element, document.querySelector('.container')); \ No newline at end of file diff --git a/webpack.config.js b/webpack.config.js new file mode 100644 index 0000000..2d2b944 --- /dev/null +++ b/webpack.config.js @@ -0,0 +1,55 @@ +var path = require('path'); +var webpack = require('webpack'); +var autoprefixer = require('autoprefixer'); +var precss = require('precss'); +var HtmlWebPackPlugin = require('html-webpack-plugin'); + +module.exports = { + entry: [ + 'webpack-dev-server/client?http://localhost:8080', + 'webpack/hot/only-dev-server', // "only" prevents reload on syntax errors + './src/index' + ], + output: { + path: path.resolve(__dirname, './dist'), + publicPath: '/', + filename: 'bundle.js' + }, + resolve: { + extensions: ['', '.js', '.jsx'] + }, + plugins: [ + new HtmlWebPackPlugin({ + template: 'src/index.html', + filename: '../index.html' + }), + new webpack.HotModuleReplacementPlugin(), + new webpack.NoErrorsPlugin() + ], + module: { + loaders: [ + { + test: /\.jsx?$/, + exclude: /node_modules/, + loaders: ['react-hot', 'babel'] + }, { + test: /\.scss$/, + loaders: ['style-loader', 'css-loader', 'postcss-loader'] + }, { + test: /\.css$/, + loaders: ['style-loader', 'css-loader'] + }, + { + test: /\.(png|jpg|svg|woff|woff2)?(\?v=\d+.\d+.\d+)?$/, + loader: 'url-loader?limit=25000' + }, + { + test: /\.(eot|ttf)$/, + loader: 'file-loader' + } + ] + }, + postcss: function() { + return [autoprefixer, precss]; + } +}; \ No newline at end of file diff --git a/webpack.config.prod.js b/webpack.config.prod.js new file mode 100644 index 0000000..184e5ee --- /dev/null +++ b/webpack.config.prod.js @@ -0,0 +1,66 @@ +var path = require('path'); +var webpack = require('webpack'); +var autoprefixer = require('autoprefixer'); +var precss = require('precss'); +var HtmlWebPackPlugin = require('html-webpack-plugin'); + +module.exports = { + devtool: 'cheap-module-source-map', + entry: [ + './src/index' + ], + output: { + path: path.resolve(__dirname, './dist'), + publicPath: './dist/', + filename: 'bundle.js' + }, + resolve: { + extensions: ['', '.js', '.jsx'] + }, + plugins: [ + new webpack.DefinePlugin({ + 'process.env':{ + 'NODE_ENV': JSON.stringify('production') + } + }), + new HtmlWebPackPlugin({ + template: 'src/index.html', + filename: '../index.html' + }), + new webpack.optimize.DedupePlugin(), + new webpack.optimize.OccurenceOrderPlugin(), + new webpack.optimize.UglifyJsPlugin({ + compress:{ + screw_ie8: true, + warnings: false + }, + }), + new webpack.NoErrorsPlugin() + ], + module: { + loaders: [ + { + test: /\.jsx?$/, + exclude: /node_modules/, + loaders: ['babel'] + }, { + test: /\.scss$/, + loaders: ['style-loader', 'css-loader', 'postcss-loader'] + }, { + test: /\.css$/, + loaders: ['style-loader', 'css-loader'] + }, + { + test: /\.(png|jpg|svg|woff|woff2)?(\?v=\d+.\d+.\d+)?$/, + loader: 'url-loader?limit=8192' + }, + { + test: /\.(eot|ttf)$/, + loader: 'file-loader' + } + ] + }, + postcss: function() { + return [autoprefixer, precss]; + } +}; \ No newline at end of file