我想知道，如果我有一个在我的组件中经常使用的外部CSS文件，是应该在每个组件中还是在根组件中导入这个外部CSS？
对于每个组件：
对于每个组件：
import React from 'react'
import '../font.css'
class MyComponent extends React.Component {
render() {
return <div className="fa fa-bandcamp"></div>;
}
}
这很容易理解：因为我想使用“fa fa-bandcamp”，所以我导入“../font.css”。
这种方法与编写JS或任何其他编程语言类似，如果需要依赖项，我们也会在文件中导入它，例如：
import global from 'global'
import util from 'util'
global.foo
global.bar
util.bar
util.bar
// ...
然而，我的同事告诉我全局 CSS 不应该在每个依赖组件中导入，而应该在根组件或 webpack 的入口文件中导入。例如：
// in each component
import React from 'react'
// import '../font.css'
class MyComponent extends React.Component {
render() {
return <div className="fa fa-bandcamp"></div>;
}
}
// in entry file (root component)
import React from 'react'
import '../font.css'
class App extends React.Component {
render() {
return <div>{this.props.children}</div>;
}
}
每种解决方案的优缺点是什么？我想听听更多建议，感谢您的帮助。