Skip to content

Commit 3a897e7

Browse files
bebrawbebraw
committed
chore - Port to webpack 2
1 parent d266545 commit 3a897e7

File tree

3 files changed

+146
-107
lines changed

3 files changed

+146
-107
lines changed

‎package.json

Lines changed: 45 additions & 46 deletions
Original file line numberDiff line numberDiff line change
@@ -41,70 +41,69 @@
4141
"sitemap": "cd build && sitemap-static --prefix=https://webpack.js.org/ > sitemap.xml"
4242
},
4343
"devDependencies": {
44-
"alex": "^3.1.0",
45-
"antwar": "0.8.1-alpha.078b5fbf",
46-
"antwar-helpers": "0.8.1-alpha.078b5fbf",
47-
"antwar-interactive": "0.8.1-alpha.078b5fbf",
48-
"antwar-prevnext-plugin": "0.8.1-alpha.078b5fbf",
49-
"async": "^2.1.2",
50-
"autoprefixer": "^6.3.7",
51-
"babel-core": "^6.10.4",
52-
"babel-eslint": "^6.1.2",
53-
"babel-loader": "^6.2.5",
54-
"babel-plugin-transform-object-rest-spread": "^6.16.0",
55-
"babel-preset-env": "^0.0.8",
56-
"babel-preset-react": "^6.11.1",
44+
"alex": "^4.0.1",
45+
"antwar": "0.8.1-alpha.aa5a1a21",
46+
"antwar-helpers": "0.8.1-alpha.aa5a1a21",
47+
"antwar-interactive": "0.8.1-alpha.aa5a1a21",
48+
"antwar-prevnext-plugin": "0.8.1-alpha.aa5a1a21",
49+
"async": "^2.1.5",
50+
"autoprefixer": "^6.7.6",
51+
"babel-core": "^6.23.1",
52+
"babel-eslint": "^7.1.1",
53+
"babel-loader": "^6.3.2",
54+
"babel-plugin-transform-object-rest-spread": "^6.23.0",
55+
"babel-preset-env": "^1.2.0",
56+
"babel-preset-react": "^6.23.0",
5757
"copy-webpack-plugin": "^4.0.1",
58-
"css-loader": "^0.25.0",
58+
"css-loader": "^0.26.2",
5959
"duplexer": "^0.1.1",
60-
"eslint": "3.6.0",
61-
"eslint-loader": "^1.5.0",
62-
"eslint-plugin-markdown": "^1.0.0-beta.2",
63-
"extract-text-webpack-plugin": "^1.0.1",
64-
"file-loader": "^0.9.0",
60+
"eslint": "3.17.0",
61+
"eslint-loader": "^1.6.3",
62+
"eslint-plugin-markdown": "^1.0.0-beta.4",
63+
"extract-text-webpack-plugin": "^2.1.0",
64+
"file-loader": "^0.10.1",
6565
"fontgen-loader": "^0.2.1",
6666
"gh-pages": "^0.12.0",
6767
"github": "^5.2.3",
68-
"html-webpack-plugin": "^2.22.0",
68+
"html-webpack-plugin": "^2.28.0",
6969
"http-server": "^0.9.0",
7070
"hyperlink": "^2.7.0",
71-
"json-loader": "^0.5.4",
72-
"lodash": "^4.16.1",
73-
"markdown-loader": "^0.1.7",
74-
"markdownlint": "^0.2.0",
71+
"lodash": "^4.17.4",
72+
"markdown-loader": "^2.0.0",
73+
"markdownlint": "^0.4.0",
7574
"markdownlint-cli": "^0.2.0",
7675
"marked": "^0.3.6",
7776
"mkdirp": "^0.5.1",
7877
"modularscale-sass": "^2.1.1",
79-
"moment": "^2.15.1",
78+
"moment": "^2.17.1",
8079
"ncp": "^2.0.0",
81-
"node-sass": "^3.9.3",
82-
"npm-run-all": "^3.1.0",
83-
"postcss-loader": "^0.13.0",
84-
"prism-languages": "^0.3.1",
85-
"prismjs": "^1.5.1",
80+
"node-sass": "^4.5.0",
81+
"npm-run-all": "^4.0.2",
82+
"postcss-loader": "^1.3.3",
83+
"prism-languages": "^0.3.3",
84+
"prismjs": "^1.6.0",
8685
"raw-loader": "^0.5.1",
87-
"request": "^2.75.0",
88-
"sass-loader": "^4.0.2",
89-
"sitemap-static": "^0.3.1",
90-
"style-loader": "^0.13.1",
91-
"tap-min": "^1.1.0",
86+
"request": "^2.80.0",
87+
"sass-loader": "^6.0.2",
88+
"sitemap-static": "^0.4.0",
89+
"style-loader": "^0.13.2",
90+
"tap-min": "^1.2.1",
9291
"tap-parser": "^5.3.3",
9392
"through2": "^2.0.3",
94-
"url-loader": "^0.5.7",
95-
"webpack": "^1.13.2",
96-
"webpack-dev-server": "^1.16.1",
97-
"webpack-merge": "^0.14.1",
93+
"url-loader": "^0.5.8",
94+
"webpack": "^2.2.1",
95+
"webpack-dev-server": "^2.4.1",
96+
"webpack-merge": "^3.0.0",
9897
"yaml-frontmatter-loader": "0.0.3"
9998
},
10099
"dependencies": {
101-
"d3": "^4.2.7",
102-
"filesize": "^3.3.0",
103-
"preact": "^6.2.1",
104-
"preact-compat": "3.11.0",
105-
"react": "^15.3.2",
106-
"react-dom": "^15.3.2",
100+
"d3": "^4.7.1",
101+
"filesize": "^3.5.5",
102+
"preact": "^7.2.0",
103+
"preact-compat": "3.13.1",
104+
"react": "^15.4.2",
105+
"react-dom": "^15.4.2",
107106
"react-router": "^2.8.1",
108-
"whatwg-fetch": "^2.0.1"
107+
"whatwg-fetch": "^2.0.3"
109108
}
110109
}

‎template.ejs

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -2,24 +2,24 @@
22
<html>
33
<head>
44
<meta charset="UTF-8">
5-
<title><%= webpackConfig.template.title %></title>
5+
<title><%= htmlWebpackPlugin.options.context.title %></title>
66
<meta name="viewport" content="width=device-width, initial-scale=1">
77
<meta name="theme-color" content="#2B3A42">
88
<link rel="shortcut icon" href="/assets/favicon.ico">
99

1010
<link href="https://fonts.googleapis.com/css?family=Source+Code+Pro:400,600|Source+Sans+Pro:200,400,400i,500" rel="stylesheet">
1111

1212
<link rel="stylesheet" href="https://cdn.jsdelivr.net/docsearch.js/2/docsearch.min.css" />
13-
<% for (var file in webpackConfig.template.cssFiles) { %>
14-
<link href="<%= webpackConfig.template.cssFiles[file] %>" rel="stylesheet">
13+
<% for (var file of htmlWebpackPlugin.options.context.cssFiles) { %>
14+
<link href="<%= file %>" rel="stylesheet">
1515
<% } %>
1616

1717
<script src="https://cdn.jsdelivr.net/docsearch.js/2/docsearch.min.js"></script>
1818
</head>
1919
<body>
2020
<%- webpackConfig.html %>
2121

22-
<% for (var script of webpackConfig.template.jsFiles) { %>
22+
<% for (var script of htmlWebpackPlugin.options.context.jsFiles) { %>
2323
<script src="<%= script %>"></script>
2424
<% } %>
2525

‎webpack.config.js

Lines changed: 97 additions & 57 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
var path = require('path');
22
var ExtractTextPlugin = require('extract-text-webpack-plugin');
33
var CopyWebpackPlugin = require('copy-webpack-plugin');
4-
var Autoprefixer = require('autoprefixer');
4+
var autoprefixer = require('autoprefixer');
55
var merge = require('webpack-merge');
66
var webpack = require('webpack');
77

@@ -13,66 +13,54 @@ var stylePaths = [
1313

1414
const commonConfig = {
1515
resolve: {
16-
extensions: ['', '.js', '.jsx', '.scss']
16+
extensions: ['.js', '.jsx', '.scss']
1717
},
1818
module: {
19-
loaders: [
19+
rules: [
2020
{
21-
test: /\.jsx?$/,
22-
loaders: ['babel-loader', 'eslint-loader'],
21+
test: /\.(js|jsx)$/,
22+
use: 'babel-loader',
2323
include: [
2424
path.join(__dirname, 'components')
2525
]
2626
},
2727
{
2828
test: /\.woff2?$/,
29-
loaders: ['url-loader?prefix=font/&limit=10000&mimetype=application/font-woff']
29+
use: {
30+
loader: 'file-loader',
31+
options: {
32+
prefix: 'font/'
33+
}
34+
}
3035
},
3136
{
32-
test: /\.jpg$/,
33-
loaders: ['file-loader']
34-
},
35-
{
36-
test: /\.png$/,
37-
loaders: ['file-loader']
38-
},
39-
{
40-
test: /\.svg$/,
41-
loaders: ['file-loader']
37+
test: /\.(jpg|png|svg)$/,
38+
use: 'file-loader'
4239
},
4340
{
4441
test: /\.html$/,
45-
loaders: ['raw-loader']
46-
},
47-
{
48-
test: /\.json$/,
49-
loaders: ['json-loader']
42+
use: 'raw-loader'
5043
}
5144
]
5245
},
53-
eslint: {
54-
fix: true,
55-
configFile: require.resolve('./.eslintrc')
56-
},
57-
postcss: function() {
58-
return [ Autoprefixer ];
59-
},
60-
sassLoader: {
61-
includePaths: [ path.join('./styles/partials') ]
62-
},
6346
plugins: [
6447
new CopyWebpackPlugin([{
6548
from: './assets',
6649
to: './assets'
67-
}])
50+
}]),
51+
new webpack.LoaderOptionsPlugin({
52+
eslint: {
53+
configFile: require.resolve('./.eslintrc')
54+
}
55+
})
6856
]
6957
};
7058

7159
const interactiveConfig = {
7260
resolve: {
7361
alias: {
74-
react: 'preact-compat',
75-
'react-dom': 'preact-compat'
62+
react: 'preact-compat/dist/preact-compat.min.js',
63+
'react-dom': 'preact-compat/dist/preact-compat.min.js'
7664
}
7765
},
7866
plugins: [
@@ -86,60 +74,112 @@ const interactiveConfig = {
8674

8775
const developmentConfig = {
8876
module: {
89-
loaders: [
77+
rules: [
78+
{
79+
test: /\.(js|jsx)$/,
80+
use: 'eslint-loader',
81+
include: [
82+
path.join(__dirname, 'components')
83+
]
84+
},
9085
{
9186
test: /\.font.js$/,
92-
loaders: ['style-loader', 'css-loader', 'fontgen-loader']
87+
use: ['style-loader', 'css-loader', 'fontgen-loader']
9388
},
9489
{
9590
test: /\.css$/,
96-
loaders: ['style-loader', 'css-loader'],
91+
use: ['style-loader', 'css-loader'],
9792
include: stylePaths
9893
},
9994
{
10095
test: /\.scss$/,
101-
loaders: ['style-loader', 'css-loader', 'postcss-loader', 'sass-loader'],
96+
use: [
97+
'style-loader',
98+
'css-loader',
99+
postcssLoader(),
100+
sassLoader()
101+
],
102102
include: stylePaths
103103
}
104104
]
105105
}
106106
};
107107

108108
const buildConfig = {
109-
plugins: [
110-
new ExtractTextPlugin('[chunkhash].css', {
111-
allChunks: true
112-
})
113-
],
114109
module: {
115-
loaders: [
110+
rules: [
111+
{
112+
test: /\.(js|jsx)$/,
113+
use: 'eslint-loader',
114+
include: [
115+
path.join(__dirname, 'components')
116+
]
117+
},
116118
{
117119
test: /\.font.js$/,
118-
loader: ExtractTextPlugin.extract(
119-
'style-loader',
120-
'css-loader!fontgen-loader?embed'
121-
)
120+
loader: ExtractTextPlugin.extract({
121+
fallback: 'style-loader',
122+
use: [
123+
'css-loader',
124+
{
125+
loader: 'fontgen-loader',
126+
options: {
127+
embed: true
128+
}
129+
}
130+
]
131+
})
122132
},
123133
{
124134
test: /\.css$/,
125-
loader: ExtractTextPlugin.extract(
126-
'style-loader',
127-
'css-loader'
128-
),
135+
loader: ExtractTextPlugin.extract({
136+
fallback: 'style-loader',
137+
use: 'css-loader'
138+
}),
129139
include: stylePaths
130140
},
131141
{
132142
test: /\.scss$/,
133-
loader: ExtractTextPlugin.extract(
134-
'style-loader',
135-
'css-loader!postcss-loader!sass-loader'
136-
),
143+
loader: ExtractTextPlugin.extract({
144+
fallback: 'style-loader',
145+
use: [
146+
'css-loader',
147+
postcssLoader(),
148+
sassLoader()
149+
]
150+
}),
137151
include: stylePaths
138152
}
139153
]
140-
}
154+
},
155+
plugins: [
156+
new ExtractTextPlugin({
157+
filename: '[chunkhash].css',
158+
allChunks: true
159+
})
160+
]
141161
};
142162

163+
function postcssLoader() {
164+
return {
165+
loader: 'postcss-loader',
166+
options: {
167+
plugins: () => ([
168+
require('autoprefixer'),
169+
]),
170+
}
171+
};
172+
}
173+
174+
function sassLoader() {
175+
return {
176+
loader: 'sass-loader',
177+
options: {
178+
includePaths: [ path.join('./styles/partials') ]
179+
}
180+
};
181+
}
182+
143183
module.exports = function(env) {
144184
switch(env) {
145185
case 'start':

0 commit comments

Comments
 (0)