React项目执行npm run build时如何忽略.nobuild后缀文件？

绝对可以实现！具体怎么操作得看你的React项目是用Create React App（CRA）默认搭建的，还是自己配置了Webpack。我分两种场景给你讲清楚：

CRA默认不允许直接修改Webpack配置，所以我们需要借助craco（一个轻量的CRA配置修改工具）来实现忽略特定文件：

• 第一步：安装craco依赖

  npm install @craco/craco --save-dev
  

• 第二步：在项目根目录创建craco.config.js文件，添加Webpack忽略规则：

  const webpack = require('webpack');
  
  module.exports = {
    webpack: {
      plugins: {
        add: [
          new webpack.IgnorePlugin({
            resourceRegExp: /\.nobuild\.js$/,
          }),
        ],
      },
    },
  };
  

• 第三步：修改package.json里的构建命令，替换默认的CRA构建脚本：

  {
    "scripts": {
      "build": "craco build"
    }
  }
  

如果你的项目是自己配置Webpack的，直接在配置文件中添加IgnorePlugin插件即可：

const webpack = require('webpack');

module.exports = {
  // 其他已有的Webpack配置项
  plugins: [
    // 新增插件：匹配所有带.nobuild.js后缀的文件，构建时忽略它们
    new webpack.IgnorePlugin({
      resourceRegExp: /\.nobuild\.js$/,
    }),
  ],
};

小提示 #

如果你的.nobuild.js文件只是存放在项目目录里的工具脚本/本地测试文件，根本没被项目代码引用，其实默认的构建过程本来就不会打包它们——Webpack只会处理被入口文件（比如src/index.js）直接或间接引入的模块。只有当这些文件被代码import了，才需要用上面的配置强制忽略打包。

内容的提问来源于stack exchange，提问作者Henrique Ramos