选项1

Question

我正在尝试学习ES6的导入和导出，但是遇到一个错误，该错误不允许我导入模块。我还尝试了从'add.js'导入.. 而没有./，但还是没有运气。

未捕获的SyntaxError：请求的模块'./add.js'不提供名为“添加”的出口

我的文件夹结构如下

C:\xampp\htdocs\es6\import.export\
- index.html
- app.js
- add.js

index.html

<html>
    <head>
        <script type="module" src="app.js"></script>
    </head>

    <body>

    </body>
</html>

app.js

import { add } from './add.js'

console.log(add(2,3))

add.js

export default function add (a, b) {
// export default function (a, b) { <-- does not work either, same error
    return a + b;
}

Answer 1

如果您具有默认导出功能，则不应使用{}

这些用于命名导出：

Answer 2

为您的导出命名，而不使用 default 。看起来应该像这样

// add.js
export const add =  (a, b) =>  a + b;
// OR
// export const add = function(a, b) { return a+b };

// app.js
import { add } from './add';

选项2

使用export default语法。看起来像这样

// add.js
export default function add(a, b) {
  return a + b;
}

// app.js
import add from './add';