Question

有一次，我能够在我的所有目录（组件，商店等）中创建一个index.js文件，该文件导出了与此类似的所有组件，以便于访问：

export ComponentA from './ComponentA/ComponentA';
export ComponentB from './ComponentB/ComponentB';
export ComponentC from './ComponentC/ComponentC';

然后我只会从其他文件中导入那些我需要的类

import { ComponentA, ComponentC } from './components';

出于某种原因，现在我现在收到错误，不知道为什么

ERROR in ./app/containers/index.js
Module build failed: SyntaxError: /Users/abritez/Documents/Projects/React-LTI-Toolprovider/app/containers/index.js: Unexpected token (1:7)
> 1 | export Widgets from './Widgets/Widgets';
    |        ^
  2 | 
    at Parser.pp.raise (/Users/abritez/Documents/Projects/React-LTI-Toolprovider/node_modules/babel-loader/node_modules/babel-core/node_modules/babylon/lib/parser/location.js:24:13)
    at Parser.pp.unexpected (/Users/abritez/Documents/Projects/React-LTI-Toolprovider/node_modules/babel-loader/node_modules/babel-core/node_modules/babylon/lib/parser/util.js:82:8)
    at Parser.pp.expect (/Users/abritez/Documents/Projects/React-LTI-Toolprovider/node_modules/babel-loader/node_modules/babel-core/node_modules/babylon/lib/parser/util.js:76:33)
    at Parser.pp.parseExportSpecifiers (/Users/abritez/Documents/Projects/React-LTI-Toolprovider/node_modules/babel-loader/node_modules/babel-core/node_modules/babylon/lib/parser/statement.js:766:8)
    at Parser.pp.parseExport (/Users/abritez/Documents/Projects/React-LTI-Toolprovider/node_modules/babel-loader/node_modules/babel-core/node_modules/babylon/lib/parser/statement.js:701:28)
    at Parser.parseExport (/Users/abritez/Documents/Projects/React-LTI-Toolprovider/node_modules/babel-loader/node_modules/babel-core/node_modules/babylon/lib/plugins/flow.js:679:20)
    at Parser.pp.parseStatement (/Users/abritez/Documents/Projects/React-LTI-Toolprovider/node_modules/babel-loader/node_modules/babel-core/node_modules/babylon/lib/parser/statement.js:115:90)
    at Parser.parseStatement (/Users/abritez/Documents/Projects/React-LTI-Toolprovider/node_modules/babel-loader/node_modules/babel-core/node_modules/babylon/lib/plugins/flow.js:621:22)
    at Parser.pp.parseTopLevel (/Users/abritez/Documents/Projects/React-LTI-Toolprovider/node_modules/babel-loader/node_modules/babel-core/node_modules/babylon/lib/parser/statement.js:30:21)
    at Parser.parse (/Users/abritez/Documents/Projects/React-LTI-Toolprovider/node_modules/babel-loader/node_modules/babel-core/node_modules/babylon/lib/parser/index.js:70:17)
    at Object.parse (/Users/abritez/Documents/Projects/React-LTI-Toolprovider/node_modules/babel-loader/node_modules/babel-core/node_modules/babylon/lib/index.js:45:50)
    at Object.exports.default (/Users/abritez/Documents/Projects/React-LTI-Toolprovider/node_modules/babel-loader/node_modules/babel-core/lib/helpers/parse.js:36:18)
    at File.parse (/Users/abritez/Documents/Projects/React-LTI-Toolprovider/node_modules/babel-loader/node_modules/babel-core/lib/transformation/file/index.js:574:40)
    at File.parseCode (/Users/abritez/Documents/Projects/React-LTI-Toolprovider/node_modules/babel-loader/node_modules/babel-core/lib/transformation/file/index.js:691:20)
    at /Users/abritez/Documents/Projects/React-LTI-Toolprovider/node_modules/babel-loader/node_modules/babel-core/lib/transformation/pipeline.js:167:12
    at File.wrap (/Users/abritez/Documents/Projects/React-LTI-Toolprovider/node_modules/babel-loader/node_modules/babel-core/lib/transformation/file/index.js:639:16)
 @ ./app/routes.js 27:18-41

Answer 1

可能与它不是默认导出或代码编译方式有关吗？

如果仅导出单个size.height，请尝试：

{{1}}

Answer 2

创建索引文件以简化导入组件时，应使用以下语法导出文件：

索引文件：

export { default as ComponentA } from "./ComponentA";

ComponentA 文件有一个导出

export default ComponentA;

如果您有一个带有多个导出的文件 MultiComponents ，例如：

export { ComponentB, ComponentC };

在索引文件中

，您应该使用以下语法：

export { ComponentB, ComponentC } from "./MultiComponents";

在index.js文件中导出React组件时出错

2 个答案: