Skip to content
This repository was archived by the owner on Feb 19, 2022. It is now read-only.

Commit 86dc723

Browse files
kenwheelerkenwheeler
authored
Merge pull request #52 from FormidableLabs/update-dependencies
Update boilerplate
2 parents 06a8941 + b563226 commit 86dc723

File tree

18 files changed

+206
-153
lines changed

18 files changed

+206
-153
lines changed

‎configuration/eslint/eslint.js‎

Lines changed: 2 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
module.exports = {
22
root: true,
33
parser: 'babel-eslint',
4-
extends: 'airbnb',
4+
extends: 'formidable/configurations/es6-react',
55
env: {
66
browser: true,
77
commonjs: true,
@@ -22,9 +22,7 @@ module.exports = {
2222
},
2323
},
2424
rules: {
25-
'global-require': 'off',
26-
'import/no-unresolved': 'off',
27-
'import/no-extraneous-dependencies': 'off',
25+
'quotes': [2, 'single', { 'allowTemplateLiterals': true }],
2826
'react/jsx-filename-extension': 'off',
2927
'react/require-extension': 'off',
3028
'react/no-multi-comp': 'warn',

‎configuration/webpack/webpack.config.dev.js‎

Lines changed: 39 additions & 50 deletions
Original file line numberDiff line numberDiff line change
@@ -1,96 +1,85 @@
1-
var path = require('path');
2-
var autoprefixer = require('autoprefixer');
3-
var webpack = require('webpack');
4-
var HtmlWebpackPlugin = require('html-webpack-plugin');
1+
const path = require('path');
2+
const autoprefixer = require('autoprefixer');
3+
const webpack = require('webpack');
4+
const HtmlWebpackPlugin = require('html-webpack-plugin');
55

6-
var src = path.resolve('src');
7-
var node_modules = path.resolve('node_modules');
6+
const src = path.resolve('src');
7+
const nodeModules = path.resolve('node_modules');
88

99
module.exports = {
1010
devtool: 'eval',
1111
entry: [
1212
'webpack-hot-middleware/client?quiet=true&noInfo=true',
1313
require.resolve('react-hot-loader/patch'),
1414
require.resolve('../polyfills/polyfills'),
15-
path.join(src, 'index'),
15+
path.join(src, 'index')
1616
],
1717
output: {
1818
path: path.resolve('build'),
1919
pathinfo: true,
2020
filename: 'static/js/bundle.js',
21-
publicPath: '/',
21+
publicPath: '/'
2222
},
2323
resolve: {
24-
extensions: ['', '.js', '.json'],
25-
packageMains: [
26-
'jsnext:main',
27-
'main',
28-
],
29-
},
30-
resolveLoader: {
31-
root: node_modules,
32-
moduleTemplates: ['*-loader'],
24+
extensions: ['.js', '.json']
3325
},
3426
module: {
35-
preLoaders: [
36-
{
37-
test: /\.js$/,
38-
loader: 'eslint',
39-
include: src,
40-
},
41-
],
4227
loaders: [
4328
{
4429
test: /\.js$/,
4530
include: src,
46-
loader: 'babel',
47-
query: require('../babel/babel.dev'),
31+
loader: 'babel-loader',
32+
query: require('../babel/babel.dev')
4833
},
4934
{
5035
test: /\.css$/,
51-
include: [src, node_modules],
52-
loader: 'style!css?modules&importLoaders=1&localIdentName=[name]__[local]___[hash:base64:5]!postcss'
36+
include: [src, nodeModules],
37+
loader: 'style-loader!css-loader?modules&importLoaders=1&localIdentName=[name]__[local]___[hash:base64:5]!postcss-loader'
5338
},
5439
{
5540
test: /\.json$/,
56-
include: [src, node_modules],
57-
loader: 'json',
41+
include: [src, nodeModules],
42+
loader: 'json-loader'
5843
},
5944
{
6045
test: /\.(jpg|png|gif|eot|svg|ttf|woff|woff2)(\?.*)?$/,
61-
include: [src, node_modules],
62-
loader: 'file',
46+
include: [src, nodeModules],
47+
loader: 'file-loader',
6348
query: {
64-
name: 'static/media/[name].[ext]',
65-
},
49+
name: 'static/media/[name].[ext]'
50+
}
6651
},
6752
{
6853
test: /\.(mp4|webm)(\?.*)?$/,
69-
include: [src, node_modules],
70-
loader: 'url',
54+
include: [src, nodeModules],
55+
loader: 'url-loader',
7156
query: {
7257
limit: 10000,
73-
name: 'static/media/[name].[ext]',
74-
},
75-
},
76-
],
77-
},
78-
eslint: {
79-
configFile: path.resolve('./configuration/eslint/eslint.js'),
80-
useEslintrc: false,
81-
},
82-
postcss: function() {
83-
return [autoprefixer];
58+
name: 'static/media/[name].[ext]'
59+
}
60+
}
61+
]
8462
},
8563
plugins: [
8664
new HtmlWebpackPlugin({
8765
inject: true,
8866
template: path.resolve('index.html'),
89-
favicon: path.resolve('favicon.png'),
67+
favicon: path.resolve('favicon.png')
68+
}),
69+
new webpack.LoaderOptionsPlugin({
70+
options: {
71+
eslint: {
72+
configFile: path.resolve('./configuration/eslint/eslint.js'),
73+
useEslintrc: false
74+
},
75+
postcss() {
76+
return [autoprefixer];
77+
}
78+
}
9079
}),
9180
new webpack.DefinePlugin({ 'process.env.NODE_ENV': '"development"' }),
9281
// Note: only CSS is currently hot reloaded
9382
new webpack.HotModuleReplacementPlugin(),
94-
new webpack.NoErrorsPlugin(),
95-
],
83+
new webpack.NoEmitOnErrorsPlugin()
84+
]
9685
};

‎configuration/webpack/webpack.config.prod.js‎

Lines changed: 50 additions & 47 deletions
Original file line numberDiff line numberDiff line change
@@ -1,14 +1,16 @@
1-
var path = require('path');
2-
var autoprefixer = require('autoprefixer');
3-
var webpack = require('webpack');
4-
var HtmlWebpackPlugin = require('html-webpack-plugin');
5-
var ExtractTextPlugin = require('extract-text-webpack-plugin');
6-
var url = require('url');
1+
const path = require('path');
2+
const autoprefixer = require('autoprefixer');
3+
const webpack = require('webpack');
4+
const HtmlWebpackPlugin = require('html-webpack-plugin');
5+
const ExtractTextPlugin = require('extract-text-webpack-plugin');
6+
const SWPrecacheWebpackPlugin = require('sw-precache-webpack-plugin');
7+
const CopyWebpackPlugin = require('copy-webpack-plugin');
8+
const HtmlWebpackInlineSourcePlugin = require('html-webpack-inline-source-plugin');
79

8-
var src = path.resolve('src');
9-
var node_modules = path.resolve('node_modules');
10+
const src = path.resolve('src');
11+
const nodeModules = path.resolve('node_modules');
1012

11-
var publicPath = '/';
13+
const publicPath = '/';
1214

1315
module.exports = {
1416
bail: true,
@@ -21,80 +23,60 @@ module.exports = {
2123
path: path.resolve('build'),
2224
filename: 'static/js/[name].[chunkhash:8].js',
2325
chunkFilename: 'static/js/[name].[chunkhash:8].chunk.js',
24-
publicPath: publicPath
26+
publicPath
2527
},
2628
resolve: {
27-
extensions: ['', '.js', '.json'],
28-
packageMains: [
29-
'jsnext:main',
30-
'main',
31-
],
32-
},
33-
resolveLoader: {
34-
root: node_modules,
35-
moduleTemplates: ['*-loader']
29+
extensions: ['.js', '.json']
3630
},
3731
module: {
38-
preLoaders: [
39-
{
40-
test: /\.js$/,
41-
loader: 'eslint',
42-
include: src
43-
}
44-
],
4532
loaders: [
4633
{
4734
test: /\.js$/,
4835
include: src,
49-
loader: 'babel',
36+
loader: 'babel-loader',
5037
query: require('../babel/babel.prod')
5138
},
5239
{
5340
test: /\.css$/,
54-
include: [src, node_modules],
41+
include: [src, nodeModules],
5542
loader: ExtractTextPlugin.extract(
5643
{
57-
fallbackLoader: 'style',
58-
loader: 'css?modules&importLoaders=1&localIdentName=[name]__[local]___[hash:base64:5]-autoprefixer!postcss',
44+
fallbackLoader: 'style-loader',
45+
loader: 'css-loader?modules&importLoaders=1&localIdentName=[name]__[local]___[hash:base64:5]-autoprefixer!postcss-loader'
5946
}
60-
),
47+
)
6148
},
6249
{
6350
test: /\.json$/,
64-
include: [src, node_modules],
65-
loader: 'json'
51+
include: [src, nodeModules],
52+
loader: 'json-loader',
53+
exclude: /manifest.json$/
6654
},
6755
{
6856
test: /\.(jpg|png|gif|eot|svg|ttf|woff|woff2)(\?.*)?$/,
69-
include: [src, node_modules],
70-
loader: 'file',
57+
include: [src, nodeModules],
58+
loader: 'file-loader',
7159
query: {
7260
name: 'static/media/[name].[hash:8].[ext]'
7361
}
7462
},
7563
{
7664
test: /\.(mp4|webm)(\?.*)?$/,
77-
include: [src, node_modules],
78-
loader: 'url',
65+
include: [src, nodeModules],
66+
loader: 'url-loader',
7967
query: {
8068
limit: 10000,
8169
name: 'static/media/[name].[hash:8].[ext]'
8270
}
8371
}
8472
]
8573
},
86-
eslint: {
87-
configFile: path.join(__dirname, '../eslint/eslint.js'),
88-
useEslintrc: false
89-
},
90-
postcss: function() {
91-
return [autoprefixer];
92-
},
9374
plugins: [
9475
new HtmlWebpackPlugin({
95-
inject: true,
76+
inject: 'body',
9677
template: path.resolve('index.html'),
9778
favicon: path.resolve('favicon.png'),
79+
inlineSource: '.(js|css)$',
9880
minify: {
9981
removeComments: true,
10082
collapseWhitespace: true,
@@ -108,9 +90,20 @@ module.exports = {
10890
minifyURLs: true
10991
}
11092
}),
93+
new HtmlWebpackInlineSourcePlugin(),
94+
new webpack.LoaderOptionsPlugin({
95+
options: {
96+
eslint: {
97+
configFile: path.resolve('./configuration/eslint/eslint.js'),
98+
useEslintrc: false
99+
},
100+
postcss() {
101+
return [autoprefixer];
102+
}
103+
}
104+
}),
111105
new webpack.DefinePlugin({ 'process.env.NODE_ENV': '"production"' }),
112106
new webpack.optimize.OccurrenceOrderPlugin(),
113-
new webpack.optimize.DedupePlugin(),
114107
new webpack.optimize.UglifyJsPlugin({
115108
compress: {
116109
screw_ie8: true,
@@ -124,6 +117,16 @@ module.exports = {
124117
screw_ie8: true
125118
}
126119
}),
127-
new ExtractTextPlugin('static/css/[name].[contenthash:8].css')
120+
new ExtractTextPlugin('static/css/[name].[contenthash:8].css'),
121+
new CopyWebpackPlugin([
122+
{ from: 'public' },
123+
{ from: 'manifest.webmanifest' }
124+
]),
125+
new SWPrecacheWebpackPlugin(
126+
{
127+
cacheId: 'formidable-react-starter',
128+
filename: 'service-worker.js'
129+
}
130+
)
128131
]
129132
};

‎index.html‎

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -3,9 +3,13 @@
33
<head>
44
<meta charset="utf-8">
55
<meta name="viewport" content="width=device-width, initial-scale=1">
6+
<meta name="theme-color" content="#db5945">
67
<title>Formidable React App Starter</title>
8+
<link rel="manifest" href="/manifest.webmanifest">
79
</head>
810
<body>
11+
<noscript>If you're seeing this message, that means <strong>JavaScript has been disabled on your browser</strong>, please <strong>enable JS</strong> to make this app work.</noscript>
12+
913
<div id="root"></div>
1014
</body>
1115
</html>

‎manifest.webmanifest‎

Lines changed: 51 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,51 @@
1+
{
2+
"name": "Formidable React Starter",
3+
"short_name": "Formidable",
4+
"start_url": ".",
5+
"display": "standalone",
6+
"background_color": "#fff",
7+
"theme_color": "#000",
8+
"description": "A modern ReactJS starter template.",
9+
"icons": [
10+
{
11+
"src": "/icons/icon-72x72.png",
12+
"sizes": "72x72",
13+
"type": "image/png"
14+
},
15+
{
16+
"src": "/icons/icon-96x96.png",
17+
"sizes": "96x96",
18+
"type": "image/png"
19+
},
20+
{
21+
"src": "/icons/icon-128x128.png",
22+
"sizes": "128x128",
23+
"type": "image/png"
24+
},
25+
{
26+
"src": "/icons/icon-144x144.png",
27+
"sizes": "144x144",
28+
"type": "image/png"
29+
},
30+
{
31+
"src": "/icons/icon-152x152.png",
32+
"sizes": "152x152",
33+
"type": "image/png"
34+
},
35+
{
36+
"src": "/icons/icon-192x192.png",
37+
"sizes": "192x192",
38+
"type": "image/png"
39+
},
40+
{
41+
"src": "/icons/icon-384x384.png",
42+
"sizes": "384x384",
43+
"type": "image/png"
44+
},
45+
{
46+
"src": "/icons/icon-512x512.png",
47+
"sizes": "512x512",
48+
"type": "image/png"
49+
}
50+
]
51+
}

0 commit comments

Comments
 (0)