infra(eslint) force single quote for js?x

.eslintrc

@@ -18,7 +18,8 @@
     "no-unreachable": 2,
     "no-unused-vars": 0,
     "no-console": 0,
-    "semi": ["error", "always"]
+    "semi": ["error", "always"],
+    "quotes": ["error", "single"]
   },
   "overrides": [
     {

src/components/Configuration/Configuration.jsx

@@ -1,20 +1,20 @@
-import React from "react";
-import ReactMarkdown from "react-markdown";
-import { Details } from "./components";
+import React from 'react';
+import ReactMarkdown from 'react-markdown';
+import { Details } from './components';
 
 const detailComponentsList = ['link', 'mode', 'entry', 'filename', 'publicPath', 'advancedOutput', 'expert', 'advancedModule', 'alias', 'advancedResolve', 'hints', 'devtool', 'target', 'externals', 'stats', 'advanced', 'libraryTarget'];
 
 const Pre = props => {
   const newChildren = React.Children.map(props.children.props.children, child => {
     if (React.isValidElement(child)) {
-      if (child.props.props.className.includes("keyword")) {
+      if (child.props.props.className.includes('keyword')) {
         if (!detailComponentsList.includes(child.props.props.componentname)) return child;
 
         return <Details children={child.props.children.slice(4, React.Children.count(child.props.children) - 4)} url={child.props.props.url} />;
       }
 
-      if (child.props.props.className.includes("comment")) {
-        return <ReactMarkdown source={child.props.children} disallowedTypes={["paragraph"]} unwrapDisallowed />;
+      if (child.props.props.className.includes('comment')) {
+        return <ReactMarkdown source={child.props.children} disallowedTypes={['paragraph']} unwrapDisallowed />;
       }
     }
 

src/components/Dropdown/Dropdown.jsx

@@ -14,7 +14,7 @@ export default class Dropdown extends React.Component {
   }
 
   _closeDropdownOnEsc(e) {
-    if (e.key === "Escape" && this.state.active) {
+    if (e.key === 'Escape' && this.state.active) {
       this.setState({ active: false}, () => {
         this.dropdownButton.focus();
       });
@@ -29,7 +29,7 @@ export default class Dropdown extends React.Component {
 
   render() {
     let { className = '', items = [] } = this.props;
-    let activeMod = this.state.active ? "dropdown__list--active" : "";
+    let activeMod = this.state.active ? 'dropdown__list--active' : '';
 
     return (
       <nav 
@@ -40,18 +40,18 @@ export default class Dropdown extends React.Component {
       >
         <button
           ref={ el => this.dropdownButton = el }
-          aria-haspopup="true"
+          aria-haspopup='true'
           aria-expanded={ String(this.state.active) }
-          aria-label="Select language"
+          aria-label='Select language'
           onClick={ this._handleClick.bind(this) }
         >
           <img
-            className="dropdown__language"
-            alt="select language"
+            className='dropdown__language'
+            alt='select language'
             src={ LanguageIcon } />
           {/* Commented out until media breakpoints are in place
           <span>{ items[0].title }</span> */}
-          <i aria-hidden="true" className="dropdown__arrow" />
+          <i aria-hidden='true' className='dropdown__arrow' />
         </button>
         <div className={ `dropdown__list ${activeMod}` }>
           <ul>
@@ -76,19 +76,19 @@ export default class Dropdown extends React.Component {
   }
 
   _handleArrowKeys(currentIndex, lastIndex, e) {
-    if (["ArrowDown", "ArrowUp"].includes(e.key)) {
+    if (['ArrowDown', 'ArrowUp'].includes(e.key)) {
       e.preventDefault();
     }
 
     let newIndex = currentIndex;
-    if (e.key === "ArrowDown") {
+    if (e.key === 'ArrowDown') {
       newIndex++;
       if (newIndex > lastIndex) {
         newIndex = 0;
       }
     }
 
-    if (e.key === "ArrowUp") {
+    if (e.key === 'ArrowUp') {
       newIndex--;
       if (newIndex < 0) {
         newIndex = lastIndex;

src/components/Organization/Organization.jsx

@@ -8,55 +8,55 @@ import './Organization.scss';
 
 const Organization = props => {
   return (
-    <Container className="organization page__content markdown">
+    <Container className='organization page__content markdown'>
       <h1>The Organization</h1>
 
       <p>The list below provides a brief overview of all commonly used projects in the webpack ecosystem.</p>
 
-      <div className="organization__projects">
+      <div className='organization__projects'>
         {
           Items.map(org => (
-            <div className="organization__project" key={ org.repo }>
-              <a className="organization__title" href={ `https://github.com/${org.repo}` }>
+            <div className='organization__project' key={ org.repo }>
+              <a className='organization__title' href={ `https://github.com/${org.repo}` }>
                 <h4>{ org.repo }</h4>
               </a>
 
               <p>{ org.description }</p>
 
               <h6>Downloads and Stars</h6>
-              <Shield content={ `npm/dm/${org.npm}`} label="npm" />
+              <Shield content={ `npm/dm/${org.npm}`} label='npm' />
               &nbsp;
-              <Shield content={ `github/stars/${org.repo}` } label="%E2%9C%AD" />
+              <Shield content={ `github/stars/${org.repo}` } label='%E2%9C%AD' />
 
               <h6>Activity</h6>
               <Shield
-                content={ `github/commits-since/${org.repo}/${encodeURIComponent("master@{6 months ago}")}` }
-                label="6m" />
+                content={ `github/commits-since/${org.repo}/${encodeURIComponent('master@{6 months ago}')}` }
+                label='6m' />
               &nbsp;
               <Shield
-                content={ `github/commits-since/${org.repo}/${encodeURIComponent("master@{3 months ago}")}` }
-                label="3m" />
+                content={ `github/commits-since/${org.repo}/${encodeURIComponent('master@{3 months ago}')}` }
+                label='3m' />
               &nbsp;
               <Shield
-                content={ `github/commits-since/${org.repo}/${encodeURIComponent("master@{1 month ago}")}` }
-                label="1m" />
+                content={ `github/commits-since/${org.repo}/${encodeURIComponent('master@{1 month ago}')}` }
+                label='1m' />
               &nbsp;
               <Shield
-                content={ `github/commits-since/${org.repo}/${encodeURIComponent("master@{1 week ago}")}` }
-                label="1w" />
+                content={ `github/commits-since/${org.repo}/${encodeURIComponent('master@{1 week ago}')}` }
+                label='1w' />
 
               <h6>Issues and PRs</h6>
-              <Shield content={ `github/issues-raw/${org.repo}` } label="issues" />
+              <Shield content={ `github/issues-raw/${org.repo}` } label='issues' />
               &nbsp;
-              <Shield content={ `github/issues-pr-raw/${org.repo}` } label="prs" />
+              <Shield content={ `github/issues-pr-raw/${org.repo}` } label='prs' />
 
               <h6>Maintainers</h6>
               {
                 (() => {
                   if (org.maintainer) {
                     return <Contributors contributors={[ org.maintainer ]} />;
 
-                  } else return <Link to="https://github.com/webpack/webpack/issues/2734">Maintainer needed...</Link>;
+                  } else return <Link to='https://github.com/webpack/webpack/issues/2734'>Maintainer needed...</Link>;
                 })()
               }
 

src/components/Support/AdditionalSupporters.js

@@ -3,39 +3,39 @@ import SegmentLogo from './logos/segment.png';
 
 export default [
   {
-    name: "MoonMail",
-    avatar: "https://static.moonmail.io/moonmail-logo.svg",
-    website: "https://moonmail.io/?utm_source=webpack.js.org",
+    name: 'MoonMail',
+    avatar: 'https://static.moonmail.io/moonmail-logo.svg',
+    website: 'https://moonmail.io/?utm_source=webpack.js.org',
     totalDonations: 11000,
-    reason: "Paypal"
+    reason: 'Paypal'
   },
   {
-    name: "Google Angular",
-    avatar: "https://res.cloudinary.com/opencollective/image/upload/v1485288529/angular_uxllte.png",
-    website: "https://angular.io/?utm_source=webpack&utm_medium=documentation&utm_campaign=sponsorship",
+    name: 'Google Angular',
+    avatar: 'https://res.cloudinary.com/opencollective/image/upload/v1485288529/angular_uxllte.png',
+    website: 'https://angular.io/?utm_source=webpack&utm_medium=documentation&utm_campaign=sponsorship',
     totalDonations: 250000,
-    reason: "Paypal"
+    reason: 'Paypal'
   },
   {
-    name: "Architects.io",
+    name: 'Architects.io',
     avatar: null,
-    website: "http://architects.io/?utm_source=webpack&utm_medium=documentation&utm_campaign=sponsorship",
+    website: 'http://architects.io/?utm_source=webpack&utm_medium=documentation&utm_campaign=sponsorship',
     totalDonations: 30000,
-    reason: "Paypal"
+    reason: 'Paypal'
   },
   {
-    slug: "peerigon",
-    name: "Peerigon",
-    avatar: "https://opencollective-production.s3-us-west-1.amazonaws.com/e8a1de10-99c8-11e6-8650-f92e594d5de8.png",
-    website: "https://peerigon.com/?utm_source=webpack&utm_medium=documentation&utm_campaign=sponsorship",
+    slug: 'peerigon',
+    name: 'Peerigon',
+    avatar: 'https://opencollective-production.s3-us-west-1.amazonaws.com/e8a1de10-99c8-11e6-8650-f92e594d5de8.png',
+    website: 'https://peerigon.com/?utm_source=webpack&utm_medium=documentation&utm_campaign=sponsorship',
     totalDonations: 144139,
-    reason: "webpack meetup 2017-07"
+    reason: 'webpack meetup 2017-07'
   },
   {
-    name: "Segment",
+    name: 'Segment',
     avatar: SegmentLogo,
-    website: "https://segment.com/?utm_source=webpack&utm_medium=documentation&utm_campaign=sponsorship",
+    website: 'https://segment.com/?utm_source=webpack&utm_medium=documentation&utm_campaign=sponsorship',
     totalDonations: 2400000,
-    reason: "Sponsorship 2017-07 - 2017-09"
+    reason: 'Sponsorship 2017-07 - 2017-09'
   }
 ];

src/utilities/content-tree-enhancers.js

@@ -16,7 +16,7 @@ const enhance = (tree, options) => {
     // delete source content directory
     .replace(dir, '')
     // Normalize url for Windows
-    .replace(/\\/g, "/")
+    .replace(/\\/g, '/')
     // remove `index` for root urls
     .replace(/\/index$/, '')
     // replace empty strings with `/`
@@ -47,7 +47,7 @@ const enhance = (tree, options) => {
     tree.anchors = anchors;
 
     Object.assign(tree, {
-      path: tree.path.replace(/\\/g, "/")
+      path: tree.path.replace(/\\/g, '/')
     }, attributes);
   }
 };

src/utilities/fetch-package-repos.js

@@ -38,7 +38,7 @@ async function paginate (org) {
 }
 
 async function main() {
-  mkdirp.sync(path.resolve(__dirname, `../../repositories/`));
+  mkdirp.sync(path.resolve(__dirname, '../../repositories/'));
 
   for (const [type, collection] of Object.entries(fetch)) {
     const result = await Promise.all(collection.map(async (item) => {

src/utilities/markdown.js

@@ -5,7 +5,7 @@ module.exports = function() {
   var renderer = new marked.Renderer();
 
   renderer.image = function(href, title, text) {
-    return `<img src="${href}" alt="${text}">`;
+    return `<img src='${href}' alt='${text}'>`;
   };
 
   // Patch IDs (this.options.headerPrefix can be undefined!)
@@ -14,10 +14,10 @@ module.exports = function() {
     var id = parsed.id;
 
     return (
-      `<h${level} class="header">
-        <a class="anchor" aria-hidden="true" href="#${id}" id="${id}"></a>
-        <span class="text">${text}</span>
-        <a aria-label="${text}" class="icon-link" href="#${id}"></a>
+      `<h${level} class='header'>
+        <a class='anchor' aria-hidden='true' href='#${id}' id='${id}'></a>
+        <span class='text'>${text}</span>
+        <a aria-label='${text}' class='icon-link' href='#${id}'></a>
       </h${level}>\n`
     );
   };
@@ -31,28 +31,28 @@ module.exports = function() {
 
     if (/-with-links/.test(lang)) {
       linksEnabled = true;
-      lang = lang.replace(/-with-links/, "");
+      lang = lang.replace(/-with-links/, '');
     }
 
     if (/-with-details/.test(lang)) {
       detailsEnabled = true;
-      lang = lang.replace(/-with-details/, "");
+      lang = lang.replace(/-with-details/, '');
     }
 
     if (linksEnabled) {
       code = code.replace(/\[([^[\]]+?)\]\((.+?)\)/g, match => {
         match = /\[([^[\]]+?)\]\((.+?)\)/.exec(match);
-        links.push('<a class="code-link" href="' + match[2] + '">' + match[1] + '</a>');
-        return "MARKDOWNLINK_" + (links.length - 1) + "_";
+        links.push(`<a class="code-link" href="${match[2]}">${match[1]}</a>`);
+        return `MARKDOWNLINK_${(links.length - 1)}_`;
       });
     }
 
     if (detailsEnabled) {
-      code = code.replace(/<details>/g, "MARKDOWNDETAILSSTART\n");
-      code = code.replace(/ *<\/details>(\n)?/g, "\nMARKDOWNDETAILSEND\n");
-      code = code.replace(/<summary>/g, "\nMARKDOWNSUMMARYSTART\n");
-      code = code.replace(/ *<\/summary>/g, "\nMARKDOWNSUMMARYEND");
-      code = code.replace(/(?:)?( *)MARKDOWNDETAILSSTART([\s\S]*?)MARKDOWNSUMMARYSTART\n/g, "MARKDOWNDETAILSSTART$2MARKDOWNSUMMARYSTART\n$1");
+      code = code.replace(/<details>/g, 'MARKDOWNDETAILSSTART\n');
+      code = code.replace(/ *<\/details>(\n)?/g, '\nMARKDOWNDETAILSEND\n');
+      code = code.replace(/<summary>/g, '\nMARKDOWNSUMMARYSTART\n');
+      code = code.replace(/ *<\/summary>/g, '\nMARKDOWNSUMMARYEND');
+      code = code.replace(/(?:)?( *)MARKDOWNDETAILSSTART([\s\S]*?)MARKDOWNSUMMARYSTART\n/g, 'MARKDOWNDETAILSSTART$2MARKDOWNSUMMARYSTART\n$1');
     }
 
     var rendered = codeTemplate.call(this, code, lang, escaped);
@@ -65,10 +65,10 @@ module.exports = function() {
     }
 
     if (detailsEnabled) {
-      rendered = rendered.replace(/MARKDOWNDETAILSSTART.*?\n/g, "<details>");
-      rendered = rendered.replace(/\n.*?MARKDOWNDETAILSEND.*?\n/g, "</details>");
-      rendered = rendered.replace(/\n.*?MARKDOWNSUMMARYSTART.*?\n/g, "<summary><span class='code-details-summary-span'>");
-      rendered = rendered.replace(/\n.*?MARKDOWNSUMMARYEND.*?\n/g, "</span></summary>");
+      rendered = rendered.replace(/MARKDOWNDETAILSSTART.*?\n/g, '<details>');
+      rendered = rendered.replace(/\n.*?MARKDOWNDETAILSEND.*?\n/g, '</details>');
+      rendered = rendered.replace(/\n.*?MARKDOWNSUMMARYSTART.*?\n/g, '<summary><span class="code-details-summary-span">');
+      rendered = rendered.replace(/\n.*?MARKDOWNSUMMARYEND.*?\n/g, '</span></summary>');
     }
 
     return rendered;
@@ -170,10 +170,10 @@ function handleHTMLSplit(tokens, htmlArray, merging) {
   }
   // finish inline code
   else if(merging.length > 0 && tickLength > 1) {
-    htmlArray.unshift(tickSplit.slice(1, tickLength).join("`"));
-    merging += tickSplit[0]+"`";
+    htmlArray.unshift(tickSplit.slice(1, tickLength).join('`'));
+    merging += tickSplit[0]+'`';
     tokens = tokens.concat(parseContent(merging));
-    merging = "";
+    merging = '';
   }  else if (merging.length === 0) {
     tokens = tokens.concat(parseContent(htmlItem));
   }
@@ -205,7 +205,7 @@ function handleHTML(t) {
       if (item.indexOf('```') !== 0) {
         // split all html tags
         const htmlArray = item.split(/\s*(<[^>]*>)/g).filter(v => (v !== '' && v !== '\n'));
-        tokens = handleHTMLSplit(tokens, htmlArray, "");
+        tokens = handleHTMLSplit(tokens, htmlArray, '');
       }
       // normally parse code block
       else {

src/utilities/test-local-storage.js

@@ -5,7 +5,7 @@
  * @return {undefined|bool} Returns false on error.
  */
 module.exports = function() {
-  const test = "localStorageTest";
+  const test = 'localStorageTest';
   try {
     localStorage.setItem(test, test);
     localStorage.removeItem(test);