I've been combing SO for a couple days now trying various things and just cannot get this to work. I'm normally a .Net developer and I inherited this so I'm kind of out of my wheelhouse here.
I followed this tutorial to get as far as I have: https://websitebeaver.com/deploy-create-react-app-to-azure-app-services
It builds and loads into Chrome on my laptop doing a npm start but running my workflow I receive the following error in the npm install, build, and test step:
TypeScript error in /home/runner/work/node_modules/@types/invariant/index.d.ts(16,68):
';' expected. TS1005
14 | interface InvariantStatic {
15 | (testValue: false, format: string, ...extra: any[]): never;
> 16 | (testValue: any, format: string, ...extra: any[]): asserts testValue;
| ^
17 | }
18 | }
19 |
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! [email protected] build: `react-scripts build --prod`
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the [email protected] build script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.
My YAML file used for this:
on:
push:
types: [created]
workflow_dispatch:
env:
AZURE_WEBAPP_NAME: Portal-Test # set this to your application's name
AZURE_WEBAPP_PACKAGE_PATH: "build" # set this to the path to your web app project, defaults to the repository root
NODE_VERSION: "10.x" # set this to the node version to use
jobs:
build-and-deploy:
name: Build and Deploy
runs-on: ubuntu-latest
environment: production
steps:
- uses: actions/checkout@v2
- name: Use Node.js 14
uses: actions/setup-node@v2
with:
node-version: '14'
- name: npm install, build, and test
run: |
# Build and test the project, then
# deploy to Azure Web App.
npm install
npm run build --if-present
npm run test --if-present
- name: "Deploy to Azure WebApp"
uses: azure/webapps-deploy@v2
with:
app-name: ${{ env.AZURE_WEBAPP_NAME }}
publish-profile: ${{ secrets.AZURE_WEBAPP_PUBLISH_PROFILE }}
package: ${{ env.AZURE_WEBAPP_PACKAGE_PATH }}
And my package.json
{
"name": "Portal-Test",
"version": "1.0.0",
"private": true,
"dependencies": {
"@capacitor/android": "^1.4.0",
"@capacitor/core": "1.3.0",
"@ionic-native/core": "^5.23.0",
"@ionic-native/in-app-browser": "^5.23.0",
"@ionic/react": "^4.11.0",
"@ionic/react-router": "^4.11.0",
"@nivo/pie": "^0.61.1",
"@types/jest": "^24.0.18",
"@types/node": "^12.7.12",
"@types/react": "^16.9.5",
"@types/react-dom": "^16.9.1",
"@types/react-router": "^5.1.1",
"@types/react-router-dom": "^5.1.0",
"chart.js": "^2.9.3",
"connected-react-router": "^6.8.0",
"cordova-plugin-inappbrowser": "^3.2.0",
"http-proxy-middleware": "^1.0.4",
"ionicons": "^4.6.3",
"node-sass": "^4.14.0",
"react": "^16.10.2",
"react-bootstrap": "latest",
"react-chartjs-2": "^2.8.0",
"react-dom": "^16.10.2",
"react-redux": "^7.2.0",
"react-router": "^5.1.0",
"react-router-dom": "^5.1.0",
"react-router-redux": "^4.0.8",
"react-scripts": "^3.4.0",
"react-spinners": "^0.8.3",
"react-toastify": "^6.0.4",
"react-toastify-redux": "^1.0.0-rc.2",
"redux": "^4.0.5",
"redux-devtools-extension": "^2.13.8",
"redux-saga": "^1.1.3",
"redux-saga-router": "^2.2.0",
"tslint": "^5.20.1",
"typesafe-actions": "^5.1.0",
"typescript": "3.6.3"
},
"scripts": {
"start": "react-scripts start",
"build": "react-scripts build --prod",
"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"
]
}
}
the tsconfig.json
{
"compilerOptions": {
"target": "es5",
"lib": [
"dom",
"dom.iterable",
"esnext"
],
"allowJs": true,
"skipLibCheck": true,
"esModuleInterop": true,
"allowSyntheticDefaultImports": true,
"strict": false,
"forceConsistentCasingInFileNames": true,
"module": "esnext",
"moduleResolution": "node",
"resolveJsonModule": true,
"isolatedModules": true,
"noEmit": true,
"jsx": "react",
"baseUrl": "./src"
},
"include": ["src"],
"exclude": ["node_modules", "lib"]
]
}
