No CSS Tags
Prevent manual stylesheet tags.
Why This Error Occurred
A link
element was used to link to an external stylesheet. This can negatively affect CSS resource loading on your webpage.
Possible Ways to Fix It
There are multiple ways to include styles using Next.js' built-in CSS support, including the option to use @import
within the root stylesheet that is imported in pages/_app.js
:
styles.css
/* Root stylesheet */
@import 'extra.css';
body {
/* ... */
}
Another option is to use CSS Modules to import the CSS file scoped specifically to the component.
pages/index.js
import styles from './extra.module.css'
export class Home {
render() {
return (
<div>
<button type="button" className={styles.active}>
Open
</button>
</div>
)
}
}
Refer to the Built-In CSS Support documentation to learn about all the ways to include CSS to your application.
Was this helpful?