我正在构建一个react + typescript网站,并使用azure静态web应用程序部署了该应用程序。
在localhost上,一切都按预期工作,但在发布的环境中,没有显示应用程序图像。查看控制台,我得到以下错误:
console error
没有png,svg,gif...加载,但它在localhost上工作。
我试着按照以下的说明去做:
https://learn.microsoft.com/en-us/azure/static-web-apps/configuration#fallback-routes
但没有成功。
这是我第一次在azure上部署应用程序,我不知道添加更多信息是否重要。
感谢所有帮助。
我的包裹
{
"name": "yarn",
"version": "0.1.0",
"private": true,
"homepage": ".",
"dependencies": {
"@anatoliygatt/dark-mode-toggle": "^1.0.0",
"@emotion/react": "^11.10.5",
"@emotion/styled": "^11.10.5",
"@testing-library/jest-dom": "^5.16.5",
"@testing-library/react": "^13.4.0",
"@testing-library/user-event": "^13.5.0",
"@types/draft-js": "^0.11.10",
"@types/jest": "^27.5.2",
"@types/node": "^16.18.3",
"@types/react": "^18.0.25",
"@types/react-dom": "^18.0.8",
"@types/victory": "^35.0.0",
"axios": "^1.3.0",
"crypto-js": "^4.1.1",
"draft-js": "^0.11.7",
"draft-js-export-html": "^1.4.1",
"env-cmd": "^10.1.0",
"keycloak-js": "^20.0.2",
"lodash": "^4.17.21",
"moment": "^2.29.4",
"react": "^18.2.0",
"react-aws-s3": "^1.5.0",
"react-aws-s3-typescript": "^1.1.5",
"react-beautiful-dnd": "^13.1.1",
"react-dom": "^18.2.0",
"react-draft-wysiwyg": "^1.15.0",
"react-hot-toast": "^2.4.0",
"react-icons": "^4.6.0",
"react-loading": "^2.0.3",
"react-router-dom": "^6.4.3",
"react-scripts": "5.0.1",
"react-select": "^5.6.1",
"react-toggle": "^4.1.3",
"styled-components": "^5.3.6",
"typescript": "^4.8.4",
"victory": "^36.6.8",
"web-vitals": "^2.1.4"
},
"scripts": {
"build:dev": "env-cmd -f .env.development yarn run build",
"build:homolog": "env-cmd -f .env.homolog yarn run build",
"build:prd": "env-cmd -f .env.production yarn run build",
"start": "react-scripts start",
"build": "react-scripts build",
"test": "react-scripts test",
"eject": "react-scripts eject"
},
"eslintConfig": {
"extends": [
"react-app",
"react-app/jest"
]
},
"browserslist": {
"production": [
">0.2%",
"not dead",
"not op_mini all"
],
"development": [
"last 1 chrome version",
"last 1 firefox version",
"last 1 safari version"
]
},
"main": "index.js",
"author": "João Victor Simonassi",
"license": "MIT",
"devDependencies": {
"@types/react-beautiful-dnd": "^13.1.2",
"@types/react-toggle": "^4.0.3",
"@types/styled-components": "^5.1.26",
"@typescript-eslint/eslint-plugin": "^5.42.1",
"@typescript-eslint/parser": "^5.42.1",
"eslint": "^8.27.0",
"eslint-plugin-react": "^7.31.10",
"file-loader": "^6.2.0"
},
"resolutions": {
"styled-components": "^5"
}
}
我的Azure管道任务:
azure tasks
1条答案
按热度按时间luaexgnf1#
在Static WebApps上,您将在
staticwebapp.config.json
文件中定义Azure Static Web Apps的配置,该文件控制mimeTypes -请尝试添加缺少的文件类型,然后进行检查。在此处查看示例配置文件:配置文件示例
staticwebapp.config.json的推荐位置是在工作流文件中设置为
app_location
的文件夹中。但是,该文件可以放置在设置为app_location的文件夹中的任何子文件夹中。我知道你已经检查了路由设置-只是确认一下,如果你已经通过“navigationFallback”在
staticwebapp.config.json
文件中添加了回退路由。参见:https://learn.microsoft.com/azure/static-web-apps/configuration#fallback-routes
此外,请按照本文档所述,查看路由中文件扩展名的任何过滤器。