Complete PR #980 #1546

pierreneter · 2017-08-25T14:18:10Z

Update webpack , antwar and dependencies.
Complete PR #980 (branch feat-webpack2).
Fix issues:

Mobile Sidebar.
...
After this PR was merged.
We can merge feat-webpack2 branch.
Related to: Port to webpack 3 and Upgrade Antwar #980, Dev - General Updates and Fixes #1525

Otherwise it's not possible to resolve imports in the entry file from other .ts or .tsx files

The sample output that was previously shown for `--profile` will not appear unless `--progress` is also used. This change spells this out, and also describes the per-module timings that `--profile` produces by itself.

Solves the following error: `configuration.output.path: The provided value "dist" is not an absolute path!`. Now it also uses the same output path as the "Getting started" > "Using a Configuration" guide.

To make it easier to discover use case reported by webpack/webpack#4665 from the documentation, as the existing array example only convey/imply that only modules are supported by this construct.

Fix definition of `webpack -p` command line option expansion, at the top of this page its missing the needed single quotes which are present down below.

We can choose to revive these later if they are requested by a significant amount of people. Also, especially the content in compatibility.md, is covered in other places (specifically in the `module-***.md` pages in `/api`).

This isn't really as much of an instructional as it is just information about different bundling and build systems.

…1338) Merge Code Splitting guides by removing all caching discussion and other extraneous content. Focuses on code splitting approaches instead. Move certain `import()` documentation to the Module API page. Use links to prevent content duplication. Replace lazy-load-react with a short, framework-agnostic lazy-loading guide.

Fix a tiny typo

Resolves #132

Resolves #141

Make some tweaks and and add a section on YAML frontmatter and the available options.

Add documentation on passing a function for `target`. Also include some minor tweaks and formatting improvements.

This tip is no longer necessary as webpack/webpack#4771 was fixed.

Unnecessary lingering comma @ the end of the exclude line

Appears to have been a clip-n-paste error from output.hashFunction's description.

Regularized capitalization/hyphenation of terms, clarified some sentence structure, and amended punctuation.

* Updated getting-started.md Small changes to conclusion for better flow into next guide. * fix: Textual changes to getting-started.md

Rewrite of this guide as a logical follow up of the `Asset Management` guide. Manifest section will be expanded on later.

Add loader chaining and `resolveLoader` examples.

Removed the example of a Webpack setup for building to both electron and web because it uses an old plugin for electron-renderer support even though Webpack has native support for target. Added example boilerplate which contains good examples of configuration files for both electron-main and electron-renderer.

Elaborate on the `devtool` options and explain in more detail how each one affects the output source mapping and compilation speed. fixes #273 fixes webpack/webpack#2725 fixes webpack/webpack#4936 fixes webpack/webpack#2766 fixes webpack/webpack#2145 fixes webpack/webpack#1689

Add an explanation of how to load polyfills on demand section in the shimming guide. Resolves #938

pierreneter · 2017-08-25T19:54:05Z

src/utilities/markdown.js

-      code = code.replace(/\[([^\[\]]+?)\]\((.+?)\)/g, match => {
-        match = /\[([^\[\]]+?)\]\((.+?)\)/.exec(match);
+      code = code.replace(/\[([^[\]]+?)\]\((.+?)\)/g, match => {
+        match = /\[([^[\]]+?)\]\((.+?)\)/.exec(match);


yarn run lint:js $ eslint . --ext .js --ext .jsx C:\Users\Pierre\Github\webpack.js.org\src\utilities\markdown.js 43:33 error Unnecessary escape character: \[ no-useless-escape 44:23 error Unnecessary escape character: \[ no-useless-escape ✖ 2 problems (2 errors, 0 warnings)

So, I removed that \.

pierreneter · 2017-08-25T21:52:09Z

Hi @skipjack I have fixed #1085 with this branch.
The initial description for this PR is incomplete.
So I will summarize the content with this comment.

This PR will:

Complete:

Port to webpack 3 and Upgrade Antwar #980 (branch: feat-webpack2), we just need merge Port to webpack 3 and Upgrade Antwar #980 after merge my PR (Complete PR #980 #1546)

Solve:

Dev - Title Missing on Voting Page #720, Dev - Display Index Pages Correctly #1085 (two first row of Dev - General Updates and Fixes #1525)
The row "Upgrade to use latest webpack" of Dev - Convert to PWA (checklist) #1400

skipjack · 2017-08-26T16:19:09Z

@pierreneter thank you for digging into this. Can you be a bit more specific about how you fixed these issues? #980 was pretty much ready to go aside from the section.all() data. Did you upgrade antwar to fix that? I get that the other updates are just to bring #980 (feat-webpack2) up to date with the recent restructuring from #1490. It just makes it hard to tell what you changed to fix the issues there.

pierreneter · 2017-08-26T19:28:29Z

Sure. Let me explain.
#980 is almost complete, and I'm just fixing some of the issues that it encounters.

Route: It has problems with recursive content filtering, make the article list of a section incorrect and display this list wrong in the sidebar:

That's the recursion problem and the way to configure the paths in antwar.config.js

The origin code:

'/': {
      content: () => (
        require.context(
          './loaders/page-loader!./content',
          true,
          /^\.\/.*\.md$/
        )
      )
...
	paths: {
        'get-started': {
          redirects: {
            '': '/guides/getting-started',
            'install-webpack': '/guides/installation',
            'why-webpack': '/guides/why-webpack',
          }
        },
        guides: {
          redirects: {
            'code-splitting-import': '/guides/code-splitting-async',
            'code-splitting-require': '/guides/code-splitting-async/#require-ensure-',
            'why-webpack': '/guides/comparison',
            'production-build': '/guides/production'
          }
        },
        configuration: {
          redirects: {
            'external-configs': 'javascript-alternatives'
          }
        },
    ...
	}
}

The settings above make all posts have the same section.

My code makes configuring the path specified and does not have this problem anymore:

 paths: {
    '/': {
    ...
-       content: () => require.context('./src/loaders/page-loader!./src/content', true, /^\.\/.*\.md$/), //This causes an error when recursively
+       content: () => require.context('./src/loaders/page-loader!./src/content', false, /^\.\/.*\.md$/),
    ...
    },
    ...
    concepts: { // Move it out of the `paths` of '/'
        title: "Comcepts",
        content: () => require.context('./src/loaders/page-loader!./src/content/concepts', false, /^\.\/.*\.md$/),
        url: ({ sectionName, fileName }) => `/${sectionName}/${fileName}/`,
        transform: (pages) => {
            return _.sortBy(pages, (page) => page.file.sort)
        },
        layout: () => require('./src/components/Page/Page.jsx').default
    },
    ...
}

Sort: Sort not work at Port to webpack 3 and Upgrade Antwar #980,

I added this feature with add line:

result.sort = result.attributes.sort || null;

into ./src/loaders/page-loader.js (https://github.com/pierreneter-repositories/webpack.js.org/blob/feat-webpack2/src/loaders/page-loader.js#L16)

And add it to new structure of antwar.config.js:


transform: (pages) => {
    return _.sortBy(pages, (page) => page.file.sort)
},

Anchors: (Dev - Display Index Pages Correctly #1085), It's about the first item of sidebar don't pass anchors to sidebar item of this index page.

The origin code (https://github.com/webpack/webpack.js.org/blob/feat-webpack2/components/sidebar/sidebar.jsx#L31):

<SidebarItem
    url={ `/${sectionName}/` }
    title="Introduction"
    currentPage= { currentPage } />

{
pages.map(({ url, title, anchors }, i) =>
  <SidebarItem
    key={ `sidebar-item-${i}` }
    index={i}
    url={ `${url}` }
    title={ title }
    anchors={ anchors }
    currentPage= { currentPage }
    onToggle={ this._recalculate.bind(this) } />
)
}

My code (https://github.com/pierreneter-repositories/webpack.js.org/blob/feat-webpack2/src/components/Sidebar/Sidebar.jsx#L33):

<SidebarItem
    url={ `/${sectionName}/` }
    title="Introduction"
    currentPage= { currentPage }
+   anchors= { anchors } />

{
pages.map(({ url, title, anchors }, i) =>
  <SidebarItem
    key={ `sidebar-item-${i}` }
    index={i}
    url={ `${url}` }
    title={ title }
    anchors={ anchors }
    currentPage= { currentPage }
    onToggle={ this._recalculate.bind(this) } />
)
}

This anchors from: https://github.com/pierreneter-repositories/webpack.js.org/blob/feat-webpack2/src/components/Sidebar/Sidebar.jsx#L13

let { sectionName, pages, currentPage, anchors } = this.props;

Added from Page.jsx (https://github.com/pierreneter-repositories/webpack.js.org/blob/feat-webpack2/src/components/Page/Page.jsx#L45):

<Interactive
        id="src/components/Sidebar/Sidebar.jsx"
        component={ Sidebar }
        sectionName={ section.name }
        pages={ section.pages().map(({
          file: {
            attributes: {
              anchors,
              title
            }
          },
          url
        }) => ({ url, title, anchors })) }
        currentPage={ url.replace('/index', '') }
+       anchors={ page.file.attributes.anchors } />

So:

Mobile Sidebar:

It errors because the "Retrieve section data" at Site.jsx (https://github.com/webpack/webpack.js.org/blob/feat-webpack2/components/site/site.jsx#L28) is out of date compared to the latest version of antwar:

The origin code:

let sections = section.all()
.map(({ title, url, pages }) => ({
  title,
  url,
  pages: pages.map(({ title, url }) => ({
    title: title || url, // XXX: Title shouldn't be coming in as undefined
    url
  }))
}));

My fix (https://github.com/pierreneter-repositories/webpack.js.org/blob/feat-webpack2/src/components/Site/Site.jsx#L27):

let sections = section.all().filter(section => section.path.hideInSidebar !== true)
.map((section) => {
  let _section = {
    title: section.path.title,
    url: section.url,
    pages: section.pages.map(page => {
      let _page = {
        title: page.file.title,
        url: page.url
      };
      return _page;
    })
  };
  return _section;
});

Why need section.path.hideInSidebar. Because of some section don't need show in sidebar, it's just a redirects, we don't need show it (there are just a few cases that we need), like (we can config at antwar.config.js):

pluginsapi: {
	title: 'API Plugin',
	redirects: {
		'': '/api/plugins',
		'compiler': '/api/plugins/compiler',
		'template': '/api/plugins/template'
	},
	hideSidebar: true
},

Mobile Sidebar fixed:

And some other bug fixes in the process of merging with the master branch.

All done.

pierreneter · 2017-08-26T19:39:21Z

Oops, it's hideInSidebar but I added hideSidebar: true at antwar.config.js. Fixed.
It work:

pierreneter · 2017-08-27T20:39:37Z

This is just an issue of #980.

Fixed with commit above.

pierreneter · 2017-08-27T20:45:35Z

And a small issue I fixed with this branch is:

present (https://github.com/webpack/webpack.js.org/blob/master/src/content/index.md):

fixed (https://github.com/pierreneter-repositories/webpack.js.org/blob/feat-webpack2/src/components/Splash/index.md):

skipjack · 2017-08-29T04:48:59Z

@pierreneter ok I think I followed most of that, thanks for the detailed explanation. I think I'll merge this into feat-webpack2 ( #980 ) which should then yield a much more concise diff (Files Changed) that we can carefully review/test. Thanks again for your work on this and patience with the delayed reviews 👍 .

skipjack · 2017-08-30T01:46:02Z

@pierreneter ok rolled everything up into one commit so we can easily roll that branch back if necessary. I'm going to check the diff there carefully now and test locally. If we can get #980 merged this week that would be fantastic 🎉 🎉

Achim Krüger and others added 30 commits June 28, 2017 23:07

docs(guides): add resolve.extensions to typescript.md (#1341)

2817af4

Otherwise it's not possible to resolve imports in the entry file from other .ts or .tsx files

docs(config): correct issue in performance.md (#1342)

685ed38

docs(api): improve documentation for --profile (#1343)

63cc51c

The sample output that was previously shown for `--profile` will not appear unless `--progress` is also used. This change spells this out, and also describes the per-module timings that `--profile` produces by itself.

docs(guides): fix path in output-managment guide (#1346)

2f1a667

Solves the following error: `configuration.output.path: The provided value "dist" is not an absolute path!`. Now it also uses the same output path as the "Getting started" > "Using a Configuration" guide.

docs(guides): fix output management entry config (#1347)

cf6460b

docs(config): elaborate on array usage in externals (#1348)

03464f8

To make it easier to discover use case reported by webpack/webpack#4665 from the documentation, as the existing array example only convey/imply that only modules are supported by this construct.

docs(guides): fix definition of webpack -p in production.md (#1349)

03e8a5d

Fix definition of `webpack -p` command line option expansion, at the top of this page its missing the needed single quotes which are present down below.

docs(guides): remove to incomplete guides

310b42e

We can choose to revive these later if they are requested by a significant amount of people. Also, especially the content in compatibility.md, is covered in other places (specifically in the `module-***.md` pages in `/api`).

docs(guides): move the comparison guide out of the guides section

690eb55

This isn't really as much of an instructional as it is just information about different bundling and build systems.

docs(license): simplify and harmonize licenses

b75c044

fix typo in doc module => _

4d371ad

Update loaders.md

3e42482

Fix a tiny typo

docs(guides): make asset-management line up with next guide (#1352)

6ea8987

fix(tests): tweak some things to please alex and proselint

8b6dc81

docs(guides): minor tweaks to code-splitting and lazy-loading

d400119

docs(config): add auxiliaryComment documentation to output.md

7fdc63f

Resolves #132

docs(api): clean up formatting in compiler.md

97fce1f

docs(api): elaborate on custom file system documentation in node.md

083a8c9

Resolves #141

docs(api): add note about MultiStats to prevent any confusion

f9e49f4

docs(writers-guide): update writers-guide (#1277)

76cd022

Make some tweaks and and add a section on YAML frontmatter and the available options.

docs(config): update target.md (#1262)

7270a60

Add documentation on passing a function for `target`. Also include some minor tweaks and formatting improvements.

docs(writers-guide): resolve some minor issues caused by 76cd022

8a2bc09

docs(guides): revert changes from #1158 (#1362)

b00c7e6

This tip is no longer necessary as webpack/webpack#4771 was fixed.

docs(guides): add warning about varying output as discussed in #1356

e5e6b24

Remove hanging comma from exclude in rules

eeca4b3

Unnecessary lingering comma @ the end of the exclude line

docs(config): fix output.hashDigest description (#1369)

75e4421

Appears to have been a clip-n-paste error from output.hashFunction's description.

docs(concepts): capitalization/hyphenation/clarification (#1387)

c4ff5d3

Regularized capitalization/hyphenation of terms, clarified some sentence structure, and amended punctuation.

docs(guides): update getting-started.md (#1350)

92bec54

* Updated getting-started.md Small changes to conclusion for better flow into next guide. * fix: Textual changes to getting-started.md

docs(guides): update output-management.md (#1344)

297c5bc

Rewrite of this guide as a logical follow up of the `Asset Management` guide. Manifest section will be expanded on later.

evilebottnawi and others added 10 commits August 23, 2017 17:17

Fix: typo in link

983b5a6

docs(dev): update how-to-write-a-loader (#1529)

bdde876

Add loader chaining and `resolveLoader` examples.

docs(guides): "behind" to "besides" in asset-management (#1514)

ac8cf3d

Update package.json

a3ee016

docs(guides): add "polyfills on demand" to shimming (#1528)

f2782aa

Add an explanation of how to load polyfills on demand section in the shimming guide. Resolves #938

Update package.json

d4a40bc

Update branch

d641820

Fix sidebar and route.

dc55139

skipjack added Build Process & Testing UI/UX Enhancement labels Aug 25, 2017

Update tests

979ff76

pierreneter commented Aug 25, 2017

View reviewed changes

Fixed #1085 (Display index pages correctly)

9385f9c

Fix typo hideInSidebar config and add title for /

cd9a194

Fixed the wrong way to select the active nav item.

2c6ed8f

pierreneter added 2 commits August 29, 2017 05:58

Fix small minor SidebarMobile and Nav links

e4903a0

Fix .gitignore

29b4d69

skipjack merged commit b748ddc into webpack:feat-webpack2 Aug 30, 2017

skipjack mentioned this pull request Aug 30, 2017

Port to webpack 3 and Upgrade Antwar #980

Merged

5 tasks

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Complete PR #980 #1546

Complete PR #980 #1546

pierreneter commented Aug 25, 2017

pierreneter Aug 25, 2017

pierreneter commented Aug 25, 2017

skipjack commented Aug 26, 2017 •

edited

Loading

pierreneter commented Aug 26, 2017

pierreneter commented Aug 26, 2017

pierreneter commented Aug 27, 2017

pierreneter commented Aug 27, 2017

skipjack commented Aug 29, 2017

skipjack commented Aug 30, 2017

Complete PR #980 #1546

Complete PR #980 #1546

Conversation

pierreneter commented Aug 25, 2017

pierreneter Aug 25, 2017

Choose a reason for hiding this comment

pierreneter commented Aug 25, 2017

skipjack commented Aug 26, 2017 • edited Loading

pierreneter commented Aug 26, 2017

pierreneter commented Aug 26, 2017

pierreneter commented Aug 27, 2017

pierreneter commented Aug 27, 2017

skipjack commented Aug 29, 2017

skipjack commented Aug 30, 2017

skipjack commented Aug 26, 2017 •

edited

Loading