在Facebook React Create App中能否用'require'替代'import'？

嘿，这个问题太懂了——同时学Node.js和React，想统一编码风格确实能少走不少弯路！直接给你说结论：完全可以用，但有几个细节得注意：

1. Create React App本身支持require #

Create React App底层用Webpack和Babel处理代码，这俩工具都兼容CommonJS的require语法。比如你写：

const React = require('react');
const MyComponent = require('./MyComponent');

项目完全能正常编译运行，不会报错。

2. 注意两种语法的差异 #

虽然能用，但require和import不是完全等价的，几个关键点要留意：

• 默认导出的处理：如果模块用export default导出，用require时得加上.default才能拿到正确的值：

  // React用默认导出，所以要加.default
  const React = require('react').default;
  // 对应import写法：import React from 'react';
  

  但命名导出就没这个问题，两者写法几乎一致：

  const { useState } = require('react');
  // 对应import写法：import { useState } from 'react';
  

• 静态解析与优化：import是ES模块的静态语法，Webpack的Tree Shaking（摇树优化）、类型检查这些功能都依赖它的静态特性；而require是动态加载，运行时才解析，可能会让一些优化失效。

3. 关于风格统一的小建议 #

其实现在Node.js也全面支持ES模块了——你可以在Node项目的package.json里加上"type": "module"，或者把文件后缀改成.mjs，就能直接用import/export语法。这样不管是React还是Node项目，都用同一种标准语法，比强行用require适配React更长远，也更符合前端生态的趋势。

总的来说，短期用require过渡完全没问题，但从长期维护和生态适配来看，更推荐统一用import/export哦！

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