Skip to content

Commit 0a1810b

Browse files
montogeekmontogeek
authored
Merge branch 'master' into issues/3094
2 parents 1fa0cc7 + 21d04b5 commit 0a1810b

36 files changed

+351
-83
lines changed

‎.gitignore

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -10,4 +10,5 @@ yarn-error.log
1010
package-lock.json
1111
.cache
1212
internal-links.tap
13-
stats.json
13+
stats.json
14+
printable.md

‎package.json

Lines changed: 11 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -25,30 +25,34 @@
2525
},
2626
"scripts": {
2727
"clean-dist": "rimraf ./dist",
28-
"clean": "npm run clean-dist && rimraf src/content/**/_*.md src/**/_*.json",
28+
"clean-printable": "rimraf src/content/**/printable.md",
29+
"preclean": "run-s clean-dist clean-printable",
30+
"clean": "rimraf src/content/**/_*.md src/**/_*.json",
2931
"start": "npm run clean-dist && cross-env NODE_ENV=development webpack-dev-server --config webpack.dev.js --env.dev",
3032
"update-repos": "node src/utilities/fetch-package-repos.js",
3133
"content": "node src/scripts/build-content-tree.js ./src/content ./src/_content.json",
32-
"build-test": "npm run build && http-server dist/",
33-
"bundle-analyze": "run-s clean fetch content && cross-env NODE_ENV=production webpack --config webpack.ssg.js && cross-env NODE_ENV=production webpack --config webpack.prod.js --profile --json > stats.json && webpack-bundle-analyzer stats.json",
34+
"bundle-analyze": "run-s clean fetch printable content && cross-env NODE_ENV=production webpack --config webpack.ssg.js && run-s clean-printable content && cross-env NODE_ENV=production webpack --config webpack.prod.js --profile --json > stats.json && webpack-bundle-analyzer stats.json",
3435
"fetch": "run-p fetch:*",
3536
"fetch:readmes": "node src/utilities/fetch-package-readmes.js",
3637
"fetch:supporters": "node src/utilities/fetch-supporters.js",
3738
"fetch:starter-kits": "node src/utilities/fetch-starter-kits.js",
3839
"prebuild": "npm run clean",
39-
"build": "run-s fetch content && cross-env NODE_ENV=production webpack --config webpack.ssg.js && cross-env NODE_ENV=production webpack --config webpack.prod.js",
40+
"build": "run-s fetch printable content && cross-env NODE_ENV=production webpack --config webpack.ssg.js && run-s clean-printable content && cross-env NODE_ENV=production webpack --config webpack.prod.js",
4041
"postbuild": "bundlesize && npm run sitemap",
42+
"build-test": "npm run build && http-server dist/",
4143
"test": "npm run lint",
4244
"lint": "run-s lint:*",
4345
"lint:js": "eslint src --ext .js,.jsx,.md --cache true --cache-location .cache/.eslintcache",
4446
"lint:markdown": "markdownlint --rules markdownlint-rule-emphasis-style --config ./.markdownlint.json *.md ./src/content/**/*.md --ignore './src/content/**/_*.md'",
4547
"lint:social": "alex . -q",
4648
"lint:prose": "cp .proselintrc ~/ && proselint src/content",
47-
"lint:links": "hyperlink -r dist/index.html --canonicalroot https://webpack.js.org/ -i --todo https://img.shields.io --todo https://codecov.io/gh --todo 'content-type-mismatch https://travis-ci.org' --todo 'Asset is used as both Html and Image' | tee internal-links.tap | tap-spot",
49+
"lint:links": "hyperlink -c 8 -r dist/index.html --canonicalroot https://webpack.js.org/ -i --todo https://img.shields.io --todo https://codecov.io/gh --todo 'content-type-mismatch https://travis-ci.org' --todo 'Asset is used as both Html and Image' | tee internal-links.tap | tap-spot",
4850
"linkcheck": "hyperlink -r dist/index.html --canonicalroot https://webpack.js.org/ --skip support__ --skip sidecar.gitter.im --skip vimdoc.sourceforge.net --skip img.shields.io --skip npmjs.com/package/ --skip opencollective.com/webpack --todo external-redirect | tee external-links.tap | tap-spot",
49-
"sitemap": "cd dist && sitemap-static --pretty --prefix=https://webpack.js.org/ > sitemap.xml",
51+
"sitemap": "cd dist && sitemap-static --ignore-file=../sitemap-ignore.json --pretty --prefix=https://webpack.js.org/ > sitemap.xml",
5052
"serve": "npm run build && sirv start ./dist --port 4000",
51-
"deploy": "gh-pages -d dist"
53+
"deploy": "gh-pages -d dist",
54+
"preprintable": "npm run clean-printable",
55+
"printable": "node ./src/scripts/concatenate-docs.js"
5256
},
5357
"husky": {
5458
"hooks": {

‎sitemap-ignore.json

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,4 @@
1+
[
2+
"app-shell/index.html",
3+
"appcache/manifest.html"
4+
]

‎src/assets/icon-print.svg

Lines changed: 1 addition & 0 deletions
Loading

‎src/components/Contributors/Contributors.scss

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,12 @@
11
@import 'functions';
22
@import 'mixins';
33

4+
.contributors__section {
5+
@media print {
6+
display: none;
7+
}
8+
}
9+
410
.contributors__list {
511
font-size: 14px;
612
margin-left: -0.5em;

‎src/components/Cube/Cube.jsx

Lines changed: 8 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -88,22 +88,16 @@ export default class Cube extends React.Component {
8888
let degrees = 0;
8989
let axis = 'y';
9090

91-
let lastTime = performance.now();
9291
let animation = () => {
93-
let nowTime = performance.now();
94-
let deltaTime = nowTime - lastTime;
95-
96-
if (repeatDelay <= deltaTime) {
97-
let obj = {};
98-
obj[axis] = degrees += 90;
92+
let obj = {};
93+
obj[axis] = degrees += 90;
94+
this.setState({ ...obj, iteration: (this.state.iteration + 1) % 4 });
95+
tick();
96+
};
9997

100-
this.setState({ ...obj, iteration: (this.state.iteration + 1) % 4 });
101-
lastTime = performance.now();
102-
}
98+
let tick = () => setTimeout(() => requestAnimationFrame(animation), repeatDelay);
10399

104-
this._requestAnimation = requestAnimationFrame(animation);
105-
};
106-
animation();
100+
this._timeout = tick();
107101
}
108102
}
109103

@@ -115,7 +109,7 @@ export default class Cube extends React.Component {
115109
this.container.removeEventListener('mouseleave', this._reset);
116110

117111
} else if (continuous) {
118-
cancelAnimationFrame(this._requestAnimation);
112+
clearTimeout(this._timeout);
119113
}
120114
}
121115

‎src/components/Gitter/Gitter.scss

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -10,6 +10,10 @@
1010
@include break {
1111
right: 1.5em;
1212
}
13+
14+
@media print {
15+
display: none;
16+
}
1317
}
1418

1519
.gitter__button {

‎src/components/NotificationBar/NotificationBar.scss

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -5,6 +5,10 @@
55
color: getColor(white);
66
background: getColor(emperor);
77

8+
@media print {
9+
display: none;
10+
}
11+
812
a {
913
color: getColor(malibu);
1014

‎src/components/Page/Page.jsx

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -77,7 +77,7 @@ class Page extends React.Component {
7777
{contentRender}
7878

7979
{loadRelated && (
80-
<div>
80+
<div className="related__section">
8181
<hr />
8282
<h3>Further Reading</h3>
8383
<ul>
@@ -91,7 +91,7 @@ class Page extends React.Component {
9191
)}
9292

9393
{loadContributors && (
94-
<div>
94+
<div className="contributors__section">
9595
<hr />
9696
<h3>Contributors</h3>
9797
<Contributors contributors={contributors} />

‎src/components/Page/Page.scss

Lines changed: 8 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -9,6 +9,13 @@
99

1010
@include break {
1111
flex: 3;
12-
padding: 1.5em;
12+
// page links not fitting in 768+ resolutions with long headings
13+
padding: 2em 1.5em 1.5em;
14+
}
15+
16+
.related__section {
17+
@media print {
18+
display: none;
19+
}
1320
}
1421
}

‎src/components/PageLinks/PageLinks.jsx

Lines changed: 11 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,7 @@
11
import React from 'react';
22
import Url from 'url';
33
import './PageLinks.scss';
4+
import icon from '../../assets/icon-print.svg';
45

56
const baseURL = 'https://github.com/webpack/webpack.js.org/edit/master/';
67

@@ -27,6 +28,16 @@ export default ({
2728
Edit Document
2829
<i className="page-links__icon icon-edit" />
2930
</a>
31+
<span className="page-links__gap">|</span>
32+
<a className="page-links__link page-links__print" onClick={_handlePrintClick} title="Print this page">
33+
Print Document
34+
<img src={icon} />
35+
</a>
3036
</div>
3137
);
3238
};
39+
40+
function _handlePrintClick (e) {
41+
e.preventDefault();
42+
window.print();
43+
}

‎src/components/PageLinks/PageLinks.scss

Lines changed: 16 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -4,11 +4,19 @@
44
.page-links {
55
position: absolute;
66
display: none;
7-
top: 1.5em;
7+
top: 0.5em;
88
right: 1.5em;
99
font-weight: 600;
1010
text-transform: uppercase;
1111

12+
@media print {
13+
display: none;
14+
}
15+
16+
@include break {
17+
display: block;
18+
}
19+
1220
&__gap {
1321
margin: 0 1em;
1422
}
@@ -24,7 +32,12 @@
2432
margin-left: 0.5em;
2533
}
2634

27-
@include break {
28-
display: block;
35+
&__print {
36+
cursor: pointer;
37+
38+
img {
39+
height: 17px;
40+
margin-left: 3px;
41+
}
2942
}
3043
}

‎src/components/Print/Print.js

Lines changed: 52 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,52 @@
1+
import React from 'react';
2+
// Load Styling
3+
import './Print.scss';
4+
import icon from '../../assets/icon-print.svg';
5+
6+
const PRINTABLE_SECTIONS = [
7+
'api',
8+
'concepts',
9+
'configuration',
10+
'contribute',
11+
'guides',
12+
'loaders',
13+
'migrate',
14+
'plugins'
15+
];
16+
17+
export default function Print (props) {
18+
const { url } = props;
19+
const printUrl = _printPageUrlFromUrl(url);
20+
21+
// not in a printable section
22+
if (!url) {
23+
return null;
24+
}
25+
26+
return (
27+
<div className="sidebar-item sidebar-item--disabled`">
28+
<i className="sidebar-item__toggle icon-vertical-bar" />
29+
<a class="sidebar-item__title sidebar-link__print" href={_printPageUrlFromUrl(url)}
30+
rel="nofollow"
31+
alt="Print"
32+
title="Print"
33+
target="_blank">
34+
Print Section
35+
<img src={icon} />
36+
</a>
37+
</div>
38+
);
39+
}
40+
41+
function _printPageUrlFromUrl(urlRaw) {
42+
// for now support both trailing slash and without it
43+
// when https://github.com/webpack/webpack.js.org/pull/3064 is merged, this is simplified.
44+
let url = urlRaw[urlRaw.length-1] === '/' ? urlRaw.substring(0, urlRaw.length-1) : urlRaw;
45+
let urlSplit = url.split('/');
46+
47+
if (!PRINTABLE_SECTIONS.includes(urlSplit[1])) {
48+
return false;
49+
}
50+
51+
return (urlSplit.length > 2) ? `/${url.split('/')[1]}/printable/` : `${url}/printable/`;
52+
}

‎src/components/Print/Print.scss

Lines changed: 10 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,10 @@
1+
.sidebar-link__print {
2+
display: flex;
3+
vertical-align: center;
4+
flex-wrap: nowrap;
5+
6+
img {
7+
height: 20px;
8+
margin-right: 2px;
9+
}
10+
}

‎src/components/Print/PrintScript.js

Lines changed: 15 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,15 @@
1+
import React from 'react';
2+
3+
const printScript = `
4+
window.matchMedia('print').addListener(function(mql) {
5+
if (!mql.matches) {
6+
window.close();
7+
}
8+
});
9+
window.print();
10+
`;
11+
export default function PrintScript () {
12+
return (
13+
<script dangerouslySetInnerHTML={{ __html: printScript }}></script>
14+
);
15+
}

‎src/components/Sidebar/Sidebar.jsx

Lines changed: 7 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -4,6 +4,7 @@ import React from 'react';
44
// Import Local Components
55
import Shield from '../Shield/Shield';
66
import SidebarItem from '../SidebarItem/SidebarItem';
7+
import Print from '../Print/Print';
78

89
// Load Styling
910
import './Sidebar.scss';
@@ -16,13 +17,15 @@ export default ({
1617
...props
1718
}) => {
1819
let group;
19-
2020
return (
2121
<nav className={`sidebar ${className}`}>
2222
<div className="sidebar__inner">
23-
<a href="https://github.com/webpack/webpack/releases">
24-
<Shield content="npm/v/webpack" label="webpack" />
25-
</a>
23+
<div className="sidebar__shields">
24+
<a href="https://github.com/webpack/webpack/releases">
25+
<Shield content="npm/v/webpack" label="webpack" />
26+
</a>
27+
</div>
28+
<Print url={currentPage} />
2629

2730
{pages.map((page, index) => {
2831
let displayGroup = group !== page.group && page.group !== '-';

‎src/components/Sidebar/Sidebar.scss

Lines changed: 17 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -34,3 +34,20 @@
3434
text-transform: uppercase;
3535
color: getColor(dusty-grey);
3636
}
37+
38+
.sidebar__shields {
39+
display: flex;
40+
flex-wrap: wrap;
41+
42+
a {
43+
margin-right: 6px;
44+
45+
img {
46+
height: 20px;
47+
}
48+
49+
&:last-child {
50+
margin: 0;
51+
}
52+
}
53+
}

‎src/components/Site/Site.scss

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -2,6 +2,7 @@
22
display: flex;
33
flex-direction: column;
44
min-height: 100vh;
5+
background: #ffffff;
56

67
&__content {
78
flex: 1 1 auto;
@@ -13,3 +14,11 @@
1314
flex: 0 0 280px;
1415
}
1516
}
17+
18+
@media print {
19+
header,
20+
nav,
21+
footer {
22+
display: none;
23+
}
24+
}

‎src/content/api/cli.md

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -11,6 +11,7 @@ contributors:
1111
- EugeneHlushko
1212
- byzyk
1313
- wizardofhogwarts
14+
- EslamHiko
1415
related:
1516
- title: Analyzing Build Statistics
1617
url: https://survivejs.com/webpack/optimizing-build/analyzing-build-statistics/
@@ -299,6 +300,7 @@ Parameter | Explanation | Usage
299300
`--define` | Define any free variable, see [shimming](/guides/shimming) | `--define process.env.NODE_ENV="'development'"`
300301
`--hot` | Enables [Hot Module Replacement](/concepts/hot-module-replacement) | `--hot=true`
301302
`--labeled-modules` | Enables labeled modules [Uses LabeledModulesPlugin] |
303+
`--live-reload` | Enables live reloading | `--live-reload=true`
302304
`--plugin` | Load this [plugin](/configuration/plugins/) |
303305
`--prefetch` | Prefetch the particular file | `--prefetch=./files.js`
304306
`--provide` | Provide these modules as globals, see [shimming](/guides/shimming) | `--provide jQuery=jquery`

0 commit comments

Comments
 (0)