传播运算符导致"npm 运行构建"中出现"Attempted import error"，但开发模式编译正常

Question

运行npm build run后，我收到以下错误，该错误在使用排列运算符删除行后消失：

> react-scripts build
Creating an optimized production build...
Failed to compile.
./src/Footer.js
Attempted import error: 'getText' is not exported from './Getters'.

npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! test-redux-app@0.1.0 build: `react-scripts build`
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the test-redux-app@0.1.0 build script.
npm ERR! This is probably not a problem with npm. There is likely additi
onal logging output above.
npm ERR! A complete log of this run can be found in:
npm ERR!     /Users/myName/.npm/_logs/2020-08-24T22_14_07_926Z-deb
ug.log

1. App.js(从npx create-react-app my-app --template redux清理的主应用程序(
2. Footer.js(组件(
3. Getters.js(选择器文件(

App.js

import React from 'react';
import Footer from './Footer';
import { getText } from './Getters';
function App() {
return <Footer/>
}
export default App; 

Footer.js

import React from 'react';
import { useSelector } from 'react-redux';
import { getText } from './Getters'; 
function Footer(){
let text = useSelector( state => 
getText( state, 'menuName' )
)
return <h1>{text}</h1>;
}
export default Footer;

Getters.js

let Getters = {}
Getters.thisFunctionIsCausingTrouble = function( state, tableName ){
let toRet = { ...state };
return toRet;
}
Getters.getText = function( state ){
return 'Text';
}
module.exports = Getters; 

在localhost上一切都很好，但当我试图构建它时，它就失败了。

同样，当我删除另一个函数的扩散运算符时，它构建得很好。

另一个奇怪的结果是，如果我从应用程序中删除import Footer和Footer调用，那么我就成功构建了。(getText导入保留在App.js中(。

为什么构建失败？

package.json

{
"name": "test-redux-app",
"version": "0.1.0",
"private": true,
"dependencies": {
"@reduxjs/toolkit": "^1.1.0",
"@testing-library/jest-dom": "^4.2.4",
"@testing-library/react": "^9.3.2",
"@testing-library/user-event": "^7.1.2",
"react": "^16.13.1",
"react-dom": "^16.13.1",
"react-redux": "^7.1.3",
"react-scripts": "3.4.3"
},
"scripts": {
"start": "react-scripts start",
"build": "react-scripts build",
"test": "react-scripts test",
"eject": "react-scripts eject"
},
"eslintConfig": {
"extends": "react-app"
},
"browserslist": {
"production": [
">0.2%",
"not dead",
"not op_mini all"
],
"development": [
"last 1 chrome version",
"last 1 firefox version",
"last 1 safari version"
]
}
}

Answer 1

将导出从es6转换为.jsx.module.exports是es6版本的导出。我也有类似的问题。通过在函数名称前面添加导出来修复此问题。例如：导出const getheader=((=>｛…｝

那么您应该能够以当前的方式导入它。