The difference between import ... from and import {} from

The import is different because the export itself is different

The first

//utils.js文件中 导出
export function phoneReg(str) {
    return /^1[3|4|5|6|7|8|9][0-9]{9}$/.test(str);
}

//导入
import {pwdReg} from "../utils/utils.js"

the second

//utils.js文件中 导出
export default function phoneReg(str) {
    return /^1[3|4|5|6|7|8|9][0-9]{9}$/.test(str);
}

//导入
import pwdReg from "../utils/utils.js"

The difference between export and export default in ES6

1. Both export and export default can be used to export constants, functions, files, modules, etc.

2. In a file or module, there can be multiple export and import, but only one export default

3. Export through export, add { } when importing, export default does not need

4. export can directly export variable expressions, but export default cannot

Note:

1. The exposed members of export default can be received by any variable, but the members exposed by export can only be received in the form of { }. This form is called "export on demand"

2. In a module, export default is only allowed to be exposed once, but export is allowed to be exposed multiple times