diff --git a/crates/oxc_linter/src/rules.rs b/crates/oxc_linter/src/rules.rs index 8e08161b7..8357eb0b5 100644 --- a/crates/oxc_linter/src/rules.rs +++ b/crates/oxc_linter/src/rules.rs @@ -284,6 +284,7 @@ mod nextjs { pub mod no_assign_module_variable; pub mod no_async_client_component; pub mod no_css_tags; + pub mod no_head_element; pub mod no_head_import_in_document; pub mod no_img_element; pub mod no_script_component_in_head; @@ -543,6 +544,7 @@ oxc_macros::declare_all_lint_rules! { nextjs::no_assign_module_variable, nextjs::no_async_client_component, nextjs::no_css_tags, + nextjs::no_head_element, nextjs::no_head_import_in_document, nextjs::no_img_element, nextjs::no_script_component_in_head, diff --git a/crates/oxc_linter/src/rules/nextjs/no_head_element.rs b/crates/oxc_linter/src/rules/nextjs/no_head_element.rs new file mode 100644 index 000000000..6811475fc --- /dev/null +++ b/crates/oxc_linter/src/rules/nextjs/no_head_element.rs @@ -0,0 +1,171 @@ +use oxc_ast::{ast::JSXElementName, AstKind}; +use oxc_diagnostics::{ + miette::{self, Diagnostic}, + thiserror::Error, +}; +use oxc_macros::declare_oxc_lint; +use oxc_span::Span; + +use crate::{context::LintContext, rule::Rule, AstNode}; + +#[derive(Debug, Error, Diagnostic)] +#[error("eslint-plugin-next(no-head-element): Do not use `
` element. Use `{children} + + ); + } + ", + None, + None, + Some(PathBuf::from("./app/layout.js")), + ), + ( + r" + export default function Layout({ children }) { + return ( + + +` from `next/head` instead.")] +#[diagnostic(severity(warning), help("See https://nextjs.org/docs/messages/no-head-element"))] +struct NoHeadElementDiagnostic(#[label] pub Span); + +#[derive(Debug, Default, Clone)] +pub struct NoHeadElement; + +declare_oxc_lint!( + /// ### What it does + /// Prevent usage of `
` element. + /// + /// ### Why is this bad? + /// + /// + /// ### Example + /// ```javascript + /// ``` + NoHeadElement, + correctness +); + +impl Rule for NoHeadElement { + fn run<'a>(&self, node: &AstNode<'a>, ctx: &LintContext<'a>) { + let Some(full_file_path) = ctx.file_path().to_str() else { return }; + let is_in_app_dir = full_file_path.contains("app/") || full_file_path.contains("app\\"); + if is_in_app_dir { + return; + } + if let AstKind::JSXOpeningElement(elem) = node.kind() { + let JSXElementName::Identifier(id) = &elem.name else { return }; + if id.name == "head" { + ctx.diagnostic(NoHeadElementDiagnostic(elem.span)); + } + } + } +} + +#[test] +fn test() { + use crate::tester::Tester; + use std::path::PathBuf; + + let pass = vec![ + ( + r"import Head from 'next/head'; + + export class MyComponent { + render() { + return ( +
+ ); + } + } + ", + None, + None, + Some(PathBuf::from("pages/index.js")), + ), + ( + r"import Head from 'next/head'; + + export class MyComponent { + render() { + return ( +
+ ); + } + } + ", + None, + None, + Some(PathBuf::from("pages/index.tsx")), + ), + ( + r" + export default function Layout({ children }) { + return ( + +
+
+ +
` from `next/head` instead. + ╭─[no_head_element.tsx:5:1] + 5 │
` from `next/head` instead. + ╭─[no_head_element.tsx:6:1] + 6 │