Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

[v2] Upgrade Gatsby v2 to webpack 4 #4588

Merged
merged 10 commits into from
Mar 23, 2018
Merged

[v2] Upgrade Gatsby v2 to webpack 4 #4588

merged 10 commits into from
Mar 23, 2018

Conversation

KyleAMathews
Copy link
Contributor

@KyleAMathews KyleAMathews commented Mar 18, 2018 •
edited
Loading

Currently JavaScript builds are going well. SplitChunksPlugin is 💯 and completely automates creating really great chunks.

I'm publishing this branch as canary releases as I go so you can try this PR out by changing the version of gatsby and any gatsby plugins to canary.

TODOs:

  • Upgrade to webpack 4
  • Combine build-css with build-javascript stage
  • exclude unused react-router/history modules
  • remove a "naming" plugins that were needed to ensure long-term caching in the past
  • remove json-loader as handled in core now
  • add support for new "mode" and "optimization" configs.
  • Get mini-css-extract-plugin working — currently seeing Module build failed: Error: Didn't get a result from child compiler for CSS Modules
  • gatsby-plugin-stylus working
  • gatsby-plugin-sass working
  • gatsby-plugin-less working
  • Inline css chunks for each page in head
  • figure out what we need to do (if anything) to ensure css chunks are lazy loaded as needed. I'm assuming we'll add is a "page resource" like with data/code and prevent pages from rendering until all css chunks are loaded.
  • remove gatsby-module-loader
  • add path prefixing support to style inlining
  • improve core postcss setup by omitting the MiniCssExtractPlugin.loader like with the SASS and LESS loaders.

Not blocking for this PR but blocking for releasing Gatsby v2

Testing instructions:

@ghost ghost assigned KyleAMathews Mar 18, 2018
@ghost ghost added the review label Mar 18, 2018
@KyleAMathews
Copy link
Contributor Author

Updated the initial comment with what's done and WIP TODOs

@m-allanson m-allanson mentioned this pull request Mar 20, 2018
Closed
sokra and others added 3 commits March 21, 2018 10:46
@sokra @KyleAMathews
[v2] Webpack 4 additions (#4627)
6ad61a1 
* escape path for regexp because windows uses backslash

* remove WatchMissingNodeModulesPlugin

* remove gatsby-module-loader in favor of using import()

* add layoutComponentChunkName to initial scripts

* add initial styles as link tags

* use stringify because it's safer

* there is no ignoreOrder option

* use [chunkhash] and [name] for CSS files

* use oneOf rule to match only one of css and css modules

* add a TODO about server rendering and CSS

* use development mode in devlop build

* add CSS support for develop mode

* use [chunkhash]

* add css inlining

* Simplify less and sass rules
@KyleAMathews
Add oneOf to gatsby-plugin-stylus
69c084f
@KyleAMathews
Add pathPrefix support for the data-href when inlining critical CSS
f07e5f2
@KyleAMathews KyleAMathews merged commit 0107f97 into v2 Mar 23, 2018
@ghost ghost removed the review label Mar 23, 2018
@KyleAMathews KyleAMathews deleted the webpack-4 branch March 23, 2018 19:22
@KyleAMathews KyleAMathews changed the title [v2][wip] Upgrade Gatsby v2 to webpack 4 [v2] Upgrade Gatsby v2 to webpack 4 Mar 23, 2018
@jquense
Copy link
Contributor

jquense commented Mar 23, 2018

excited to try this out!

@KyleAMathews
Copy link
Contributor Author

Out in gatsby@2.0.0-alpha.12!

m-allanson added a commit to m-allanson/gatsby that referenced this pull request Apr 4, 2018
@m-allanson
Merge branch 'v2' into postcss-experiment
a562f7e 
* v2:
  Docgen improvements (gatsbyjs#4757)
  adjust createLocation calls after gatsbyjs#4714 (gatsbyjs#4805)
  Update breaking changes doc
  use basename for router instead of prefixing in link (gatsbyjs#4714)
  Fix inlined styles with path-prefixing (gatsbyjs#4717)
  Publish
  Upgrade & format
  [v2][wip] Upgrade Gatsby v2 to webpack 4 (gatsbyjs#4588)
  fix some jsdoc parsing bits (gatsbyjs#4675)
  [v2] fix wrong merge
  Publish
  Migrate to React Hot Loader v4 (gatsbyjs#4500)
  [v2] Fix deleteNodes deprecation (gatsbyjs#4453)
  Publish
  Switch to latest version of sharp to prevent yarn/npm errors (gatsbyjs#4417)

# Conflicts:
#	packages/gatsby/package.json
#	packages/gatsby/src/utils/webpack-utils.js
#	yarn.lock
@pieh pieh mentioned this pull request May 28, 2018
Closed
mwfrost pushed a commit to mwfrost/gatsby that referenced this pull request Apr 20, 2023
@KyleAMathews
[v2][wip] Upgrade Gatsby v2 to webpack 4 (gatsbyjs#4588)
64ae316 
* WIP'

* WIP

* Upgrade packages

* Use mini-css-extract-plugin instead of extract-text-webpack-plugin

* Add mini-css-extract-plugin to sass/less plugins

* Combine build-css with build-javascript — css modules not working atm

* [v2] Webpack 4 additions (gatsbyjs#4627)

* escape path for regexp because windows uses backslash

* remove WatchMissingNodeModulesPlugin

* remove gatsby-module-loader in favor of using import()

* add layoutComponentChunkName to initial scripts

* add initial styles as link tags

* use stringify because it's safer

* there is no ignoreOrder option

* use [chunkhash] and [name] for CSS files

* use oneOf rule to match only one of css and css modules

* add a TODO about server rendering and CSS

* use development mode in devlop build

* add CSS support for develop mode

* use [chunkhash]

* add css inlining

* Simplify less and sass rules

* Add oneOf to gatsby-plugin-stylus

* Add pathPrefix support for the data-href when inlining critical CSS
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Reviewers
No reviews
Assignees

@KyleAMathews KyleAMathews

Labels
None yet
Projects
None yet
Milestone
No milestone
Development

Successfully merging this pull request may close these issues.
3 participants
@KyleAMathews @jquense @sokra