Skip to content

jantimon/reproduction-nextjs-module-css-optimization

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

4 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

This uses the Next.js template to reporting a bug in the Next.js repository.

Reproduction Steps

npm i 
npm run build
Route (pages)                             Size     First Load JS
┌ ○ /                                     780 B          78.9 kB
├   └ css/6ab5fea530a348de.css            367 B
└ ○ /404                                  182 B          78.3 kB
+ First Load JS shared by all             78.1 kB
  ├ chunks/framework-2c16ac744b6cdea6.js  45.2 kB
  ├ chunks/main-d7239acbfe0deb02.js       31.9 kB
  └ other shared chunks (total)           945 B

○  (Static)  prerendered as static content

Patch

rm -rf .next
npm run patch
npm run build

Route (pages)                             Size     First Load JS
┌ ○ /                                     682 B          78.7 kB
├   └ css/6ab5fea530a348de.css            367 B
└ ○ /404                                  182 B          78.2 kB
+ First Load JS shared by all             78 kB
  ├ chunks/framework-2c16ac744b6cdea6.js  45.2 kB
  ├ chunks/main-d7239acbfe0deb02.js       31.9 kB
  └ other shared chunks (total)           907 B

○  (Static)  prerendered as static content

As you can see, the size of the first load JS is reduced by ~100 bytes. For a larger project, this would be more significant.

Patch:

diff --git a/node_modules/next/dist/build/webpack/config/blocks/css/loaders/client.js b/node_modules/next/dist/build/webpack/config/blocks/css/loaders/client.js
index e482b46..1b35d91 100644
--- a/node_modules/next/dist/build/webpack/config/blocks/css/loaders/client.js
+++ b/node_modules/next/dist/build/webpack/config/blocks/css/loaders/client.js
@@ -39,7 +39,7 @@ function getClientStyleLoader({ hasAppDir, isAppDir, isDevelopment, assetPrefix
         loader: MiniCssExtractPlugin.loader,
         options: {
             publicPath: `${assetPrefix}/_next/`,
-            esModule: false
+            esModule: true
         }
     };
 }

About

No description, website, or topics provided.

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published