我一直在使用Next.js本地开发这个应用程序。它在本地部署和构建得很好,但在将其部署到Fleek和Vercel时,我遇到了让它工作的问题。
在Fleek上,我已经为Next.js应用程序配置了部署和构建设置,但我仍然遇到这个问题。
当我尝试部署并构建到Fleek上的实时服务器时,我得到以下错误:
2:39:21 PM 12/11/2022: Failed to compile.
2:39:21 PM 12/11/2022: ./components/Pool.js
2:39:21 PM 12/11/2022: Module not found: Can't resolve './Withdraw' in '/workspace/components'
2:39:21 PM 12/11/2022: Import trace for requested module:
2:39:21 PM 12/11/2022: ./pages/Stake.js
2:39:21 PM 12/11/2022: > Build failed because of webpack errors
2:39:21 PM 12/11/2022: error Command failed with exit code 1.
下一个.config.js文件:
/** @type {import('next').NextConfig} */
const nextConfig = {
reactStrictMode: true,
swcMinify: true,
eslint: {
ignoreDuringBuilds: true,
},
resolve: {
extensions: ["", ".js", ".jsx"],
},
}
module.exports = nextConfig
包。json文件:
{
"name": "gwin-app",
"version": "0.1.0",
"private": true,
"scripts": {
"dev": "next dev",
"build": "next build",
"start": "next start",
"lint": "next lint"
},
"dependencies": {
"@headlessui/react": "^1.6.6",
"@heroicons/react": "^1.0.6",
"moralis": "^1.9.0",
"next": "12.2.2",
"react": "18.2.0",
"react-dom": "18.2.0",
"react-hot-toast": "^2.3.0",
"react-moralis": "^1.4.0",
"tw-elements": "^1.0.0-alpha12",
"web3": "^1.7.5",
"web3uikit": "^0.1.170"
},
"devDependencies": {
"autoprefixer": "^10.4.7",
"eslint": "8.20.0",
"eslint-config-next": "12.2.2",
"postcss": "^8.4.14",
"tailwindcss": "^3.1.6"
}
}
下面是Pool.js
中的导入import Withdraw from "./Withdraw"
Withdraw.js是这样的
#imports
const Withdraw = ({
#props
}) => {
#stuff
}
export default Withdraw
我试过:
- 在next.config.js中忽略eslint。
- 将Withdraw.js的路径从'../components/撤回"to"。/Withdraw' (Pool.js和Withdraw.js都在components文件夹中)。我想也许另一条路会有帮助。
- yarn build &&
- 检查组件是否"退出";和";Withdraw.js">
- 解析ext. in next.config.js
这是git和操作系统的大小写敏感问题。
在这里找到更多信息https://github.com/vercel/next.js/issues/9482 .
@jamesmosier指出如下:
尝试完全更改文件名并再次测试。git和操作系统可能存在大小写敏感问题,特别是如果你将一个文件作为一个case提交(例如componentOne.js),然后稍后将其更改(例如componentOne.js)。如果可以,提交新的文件名,然后你可以把它改回原来的文件名,并再次提交。
这个错误很难发现,因为在IDE中没有任何错误的迹象,一切似乎都是100%正确的,但在幕后有大小写敏感问题。
那么执行以下操作:
- 重命名模块Withdraw.js和所有引用到的东西全新的
- 提交更改
- 将所有内容重命名为所需名称并提交/推送更改
在此之后,问题解决并部署应用程序。