Question

在目录的根目录（例如components/，containers/），我有一个index.jsx文件，可立即导出所有组件，以便我可以像这样导入它们： / p>

    import {SampleOne, SampleTwo} from '../components'.

但是，根index.jsx文件不适用于以下内容：

    import SampleOne from './SampleOne/SampleOne';
    import SampleTwo from './Sample/SampleTwo';

    export default {
      SampleOne,
      SampleTwo  
    };

所以，我将它转换为以下（基本相同）：

    export {default as SampleOne} from './SampleOne/SampleOne';
    export {default as SampleTwo} from './SampleTwo/SampleTwo';

但是，我收到了这个警告：

    Can't make class (SampleOne & SampleTwo) hot reloadable due to being read-only.
    To fix this you can try two solutions. First, you can exclude files or directories
    (for example, /node_modules/) using 'exclude' option in loader configuration.
    Second, if you are using Babel, you can enable loose mode for `es6.modules` using
    the 'loose' option. See: http://babeljs.io/docs/advanced/loose/
    and http://babeljs.io/docs/usage/options/

Answer 1

经过大量的打击，我们取代了

export {default as SampleOne} from './SampleOne/SampleOne';
export {default as SampleTwo} from './SampleTwo/SampleTwo';

带

import {default as SampleOne} from './SampleOne/SampleOne';
import {default as SampleTwo} from './SampleTwo/SampleTwo';

export {SampleOne, SampleTwo};

这似乎对我们有用。

Answer 2

我遇到了同样的问题，因为我在每个模块中使用index.js来导出所有子模块，如下所示：

export {default as SampleOne} from './SampleOne/SampleOne';
export {default as SampleTwo} from './SampleTwo/SampleTwo';

根据the discussion in the react-hot-loader repo，你可以忽略它（因为它仍然被加载）或者不重新导出模块。

即时ES6导出（React，Webpack，Babel）

2 个答案: