How to minify Javascript / or how to use SWC ?

[Elindo586]

Summary

Getting this error after the steps below.

Is SWC part of Next.js / Vercel?

Anyway... I got the information from some Next.js pages...

Reference:
https://nextjs.org/docs/architecture/nextjs-compiler

I understand you have to add this code to next.config.js

compiler: {
    styledComponents: true,
  },

Also, from this linked page:
https://swc.rs/

npm i -D @swc/cli @swc/core

then for minification
https://swc.rs/docs/configuration/minification

I created a file at the root
.swcrc

{
 // Enable minification
 "minify": true,
 // Optional, configure minification options
 "jsc": {
 "minify": {
 "compress": {
 "unused": true
 },
 "mangle": true
 }
 }
}

^^^ How could I fix it?

Additional information

No response

Example

No response

[icyJoseph]

Hi,

The problem with running a tool like lighthouse is that it picks up on everything running in your current browser session, including extensions!

If its often a good idea to run this in an incognito window, or, better yet using the lighthouse CLI.

So to summarise, this is not an issue with your app, lighthouse is just picking on an an extension you have installed, and flagging that.

For completeness sake, during build time Next.js already minifies your code, by using SWC, or Terser, by default, you don't have to worry about this.

[Elindo586]

Effing goodness...

So I don't need to install anything from SWC?

I just ran lighthouse from an incognito tab, and I don't see any of the minify CSS or JavaScript..

Still have other issues on some pages like reduce unused CSS and JavaScript.... but I am gonna be working on those coming up..

[icyJoseph]

Not manually at least. SWC is used by default by Next.js