问题
Hello? Leave a question.
I am currently trying to deploy nuxt using a resource called web app in azure.
I configured HOST 0.0.0.0 in the created web app resource.
The result of the git action was successful. If you connect with the URL and check the log stream, an error is displayed.
2020-11-26T10:10:58.211257088Z: [INFO] _____
2020-11-26T10:10:58.211294589Z: [INFO] / _ \ __________ _________ ____
2020-11-26T10:10:58.211335890Z: [INFO] / /_\ \___ / | \_ __ \_/ __ \
2020-11-26T10:10:58.211339990Z: [INFO] / | \/ /| | /| | \/\ ___/
2020-11-26T10:10:58.211344790Z: [INFO] \____|__ /_____ \____/ |__| \___ >
2020-11-26T10:10:58.211348490Z: [INFO] \/ \/ \/
2020-11-26T10:10:58.211351790Z: [INFO] A P P S E R V I C E O N L I N U X
2020-11-26T10:10:58.211354890Z: [INFO]
2020-11-26T10:10:58.211357890Z: [INFO] Documentation: http://aka.ms/webapp-linux
2020-11-26T10:10:58.211360990Z: [INFO] NodeJS quickstart: https://aka.ms/node-qs
2020-11-26T10:10:58.211364090Z: [INFO] NodeJS Version : v12.18.3
2020-11-26T10:10:58.211367190Z: [INFO] Note: Any data outside '/home' is not persisted
2020-11-26T10:10:58.211370390Z: [INFO]
2020-11-26T10:10:58.400862445Z: [INFO] Cound not find build manifest file at '/home/site/wwwroot/oryx-manifest.toml'
2020-11-26T10:10:58.401292554Z: [INFO] Could not find operation ID in manifest. Generating an operation id...
2020-11-26T10:10:58.401303054Z: [INFO] Build Operation ID: 47563387-a96d-4c70-8ba6-b5e6469440a9
2020-11-26T10:11:00.795887144Z: [INFO] Writing output script to '/opt/startup/startup.sh'
2020-11-26T10:11:01.393471672Z: [INFO] Running #!/bin/sh
2020-11-26T10:11:01.398639871Z: [INFO]
2020-11-26T10:11:01.398667172Z: [INFO] # Enter the source directory to make sure the script runs where the user expects
2020-11-26T10:11:01.398684372Z: [INFO] cd "/home/site/wwwroot"
2020-11-26T10:11:01.403063957Z: [INFO]
2020-11-26T10:11:01.403124458Z: [INFO] export NODE_PATH=/usr/local/lib/node_modules:$NODE_PATH
2020-11-26T10:11:01.403130958Z: [INFO] if [ -z "$PORT" ]; then
2020-11-26T10:11:01.404638687Z: [INFO] export PORT=8080
2020-11-26T10:11:01.404651687Z: [INFO] fi
2020-11-26T10:11:01.404656187Z: [INFO]
2020-11-26T10:11:01.414097569Z: [INFO] npm start
2020-11-26T10:11:03.467639683Z: [ERROR] npm info it worked if it ends with ok
2020-11-26T10:11:03.468712604Z: [ERROR] npm info using npm@6.14.8
2020-11-26T10:11:03.476919062Z: [ERROR] npm info using node@v12.18.3
2020-11-26T10:11:04.226149815Z: [ERROR] npm info lifecycle nuxt-template@~prestart: nuxt-template@
2020-11-26T10:11:04.283394119Z: [ERROR] npm info lifecycle nuxt-template@~start: nuxt-template@
2020-11-26T10:11:04.284175634Z: [INFO]
2020-11-26T10:11:04.284189535Z: [INFO] > nuxt-template@ start /home/site/wwwroot
2020-11-26T10:11:04.284194735Z: [INFO] > cross-env PORT=8080 nuxt start
2020-11-26T10:11:04.284198435Z: [INFO]
2020-11-26T10:11:04.424650044Z: [ERROR] /home/site/wwwroot/node_modules/.bin/cross-env: 1: /home/site/wwwroot/node_modules/.bin/cross-env: ../cross-env/src/bin/cross-env.js: not found
Check that error, in the npm start script I added npm install && nuxt start but it still failed.
I haven't been able to fix it for several days. I seek help.
azure is currently learning with a free trial period.
{
"name": "nuxt-template",
"private": true,
"scripts": {
"dev": "nuxt",
"build": "nuxt build",
"start": "cross-env PORT=8080 nuxt start",
"start:success": "node ./server/index.js",
"generate": "nuxt generate",
"lint:js": "eslint --ext .js,.vue --ignore-path .gitignore .",
"lint": "npm run lint:js"
},
"dependencies": {
"@nuxtjs/axios": "^5.12.2",
"consola": "^2.15.0",
"core-js": "^3.6.5",
"express": "^4.17.1",
"nuxt": "^2.14.6",
"cross-env": "^7.0.2"
},
"devDependencies": {
"@nuxtjs/eslint-config": "^3.1.0",
"@nuxtjs/eslint-module": "^2.0.0",
"babel-eslint": "^10.1.0",
"eslint": "^7.10.0",
"eslint-config-prettier": "^6.12.0",
"eslint-plugin-nuxt": "^1.0.0",
"eslint-plugin-prettier": "^3.1.4",
"prettier": "^2.1.2"
}
}
- git action workflow
# Docs for the Azure Web Apps Deploy action: https://github.com/Azure/webapps-deploy
# More GitHub Actions for Azure: https://github.com/Azure/actions
name: Build and deploy Node.js app to Azure Web App - vue-nuxt-test2
on:
push:
branches:
- master
env:
NODE_VERSION: '12.x'
jobs:
build-and-deploy:
runs-on: ubuntu-18.04
steps:
- uses: actions/checkout@master
- name: Set up Node.js version
uses: actions/setup-node@v1
with:
node-version: ${{ env.NODE_VERSION }}
- name : npm install dependencies
run: npm install
- name: build
run: npm run build
- name: 'Deploy to Azure Web App'
uses: azure/webapps-deploy@v2
with:
app-name: 'vue-nuxt-test2'
slot-name: 'production'
publish-profile: ${{ secrets.AzureAppService_PublishProfile_195c716255634fe2b1f37a81b2014072 }}
package: .
回答1:
"start": "cross-env PORT=8080 nuxt start",
Why you add cross-env
command in package.json
files?
First of all, we need to clarify what problem cross-env
solves and was born. Mainly to solve the problem of environment variables under windows
. And your webapp is deployed under linux
, the current problems, after my attempts, I initially think that we do not have sudo
permissions, can not install cross-env
globally.
Then in azure, only ports 80
and 443
are supported, cross-env PORT=8080 nuxt start
, even if the dependencies of cross-env
exist in the linux environment, an error will be reported. Because the specified port 8080
is not supported.
So just remove cross-env PORT=8080
.
In package.json
.
"scripts": {
"dev": "nuxt",
"build": "nuxt build",
"start": "nuxt start",
"generate": "nuxt generate"
},
In nuxt.config.js
.
server: {
port: process.env.PORT, // default: 3000
host: '0.0.0.0' // default: localhost
},
Then you can deploy it.
For more details about cross-env
, please refer to this link.
The use of cross env in Vue
来源:https://stackoverflow.com/questions/65019965/how-to-deploy-nuxtnuxt-js-in-azureweb-app-not-found-module