如何修复React中的import/no-anonymous-default-export ESLint错误？

这个报错是因为ESLint的import/no-anonymous-default-export规则禁止直接匿名导出对象，要求先把对象赋值给一个具名变量，再作为默认导出。

修复方案一：给对象命名后导出（推荐） #

把当前的默认导出代码改成下面这样，先创建一个具名变量，再导出这个变量：

import email from '../assets/email.png';
import mobile from '../assets/mobile.png';
import api from '../assets/api.png';
import cpp from '../assets/cpp.png';
import css from '../assets/css.png';
import figma from '../assets/figma.png';
import flutter from '../assets/flutter.png';
import git from '../assets/git.png'; 
import graphql from '../assets/graphql.png'; 
import html from '../assets/html.png';
import javascript from '../assets/javascript.png'; 
import mu5 from '../assets/mu5.png'; 
import node from '../assets/node.png'; 
import python from '../assets/python.png'; 
import react from '../assets/react.png'; 
import redux from '../assets/redux.png'; 
import sass from '../assets/sass.png'; 
import typescript from '../assets/typescript.png'; 
import vue from '../assets/vue.png';
import about01 from '../assets/about01.png'; 
import about02 from '../assets/about02.png'; 
import about03 from '../assets/about03.png'; 
import about04 from '../assets/about04.png'; 
import profile from '../assets/profile.png'; 
import circle from '../assets/circle.svg'; 
import logo from '../assets/logo.png'; 
import adidas from '../assets/adidas.png'; 
import amazon from '../assets/amazon.png'; 
import asus from '../assets/asus.png'; 
import bolt from '../assets/bolt.png'; 
import nb from '../assets/nb.png'; 
import skype from '../assets/skype.png'; 
import spotify from '../assets/spotify.png';

// 先创建具名变量
const images = {
  email, mobile, api, cpp, css, figma, flutter, git, graphql, html, javascript, mu5, node, python, react, redux, sass, typescript, vue, about01, about02, about03, about04, profile, circle, logo, adidas, amazon, asus, bolt, nb, skype, spotify
};

// 导出这个变量作为默认导出
export default images;

修复方案二：禁用该ESLint规则（不推荐，除非特殊需求） #

如果不想修改代码结构，可以在当前文件顶部添加注释，禁用这条规则：

/* eslint-disable import/no-anonymous-default-export */
import email from '../assets/email.png';
// ... 其他导入代码

export default {
  // ... 原对象内容
};

也可以在项目的ESLint配置文件（比如.eslintrc.js或.eslintrc.json）里全局禁用这条规则：

{
  "rules": {
    "import/no-anonymous-default-export": "off"
  }
}

优先推荐方案一，具名变量能提升代码可读性，也符合这条ESLint规则的设计初衷——避免匿名导出带来的调试和维护困扰。

内容的提问来源于stack exchange，提问作者Joshua C. Adumchimma