Reputation: 2456
I am trying to deploy an vue app in AWS amplify.
Below is my build configuration-
version: 0.1
frontend:
phases:
preBuild:
commands:
- npm install
build:
commands:
- npm run production
artifacts:
baseDirectory: dist
files:
- '**/*'
cache:
paths:
- node_modules/**/*
My package.json in the vue app -
{
"name": "foobar",
"version": "0.1.0",
"private": true,
"scripts": {
"start": "./bin/web.js",
"serve": "vue-cli-service serve --mode development",
"production": "vue-cli-service build --mode production",
"sandbox": "vue-cli-service build --mode sandbox",
"lint": "vue-cli-service lint"
},
"dependencies": {
"axios": "^0.18.0",
"bignumber.js": "^8.0.1",
"bootstrap": "^4.3.1",
"connect-history-api-fallback": "^1.5.0",
"cors": "^2.8.5",
"currency-formatter": "^1.5.3",
"ethereum-blockies": "^0.1.1",
"ethereum-blockies-base64": "^1.0.2",
"express": "^4.16.4",
"from-now": "^1.0.2",
"jquery": "^3.3.1",
"lodash": "^4.17.11",
"moment": "^2.22.2",
"popper.js": "^1.14.7",
"socket.io-client": "^2.3.0",
"vue": "^2.5.17",
"vue-axios": "^2.1.4",
"vue-multiselect": "^2.1.4",
"vue-router": "^3.0.1",
"vuejs-paginate": "^2.1.0",
"vuex": "^3.0.1"
},
"devDependencies": {
"@vue/cli-plugin-babel": "^3.2.0",
"@vue/cli-plugin-eslint": "^3.2.0",
"@vue/cli-plugin-unit-mocha": "^3.2.0",
"@vue/cli-service": "^3.2.0",
"@vue/test-utils": "^1.0.0-beta.20",
"babel-eslint": "^10.0.1",
"chai": "^4.1.2",
"eslint": "^5.8.0",
"eslint-plugin-vue": "^5.0.0-0",
"node-sass": "^4.11.0",
"sass-loader": "^7.1.0",
"vue-cli-plugin-bootstrap": "^1.0.0-alpha.1",
"vue-template-compiler": "^2.5.17"
}
}
In the build step it's failing, so I pulled up the log and saw following error-
2020-03-25T06:37:48.522Z [WARNING]: sh: vue-cli-service: command not found
Why the error? vue-cli-service
is there in the dev dependencies.
Upvotes: 4
Views: 8431
Reputation: 11
Wow, it's been a while since this question was asked. In my case I was able to solve it by setting the NODE_ENV variable to "development" in the prebuild commands, like this:
frontend:
phases:
preBuild:
commands:
- NODE_ENV=development
- npm ci
build:
commands:
- NODE_ENV=${NODE_ENV}
- npm run build --prod
This way you can install without problems the devDependencies which is where @vue/cli-service` is added.
Upvotes: 1
Reputation: 433
Is the vue-cli-service not intended only to be used for development? Amplify is not going to serve your content from that service, its a development dependency which you would use to run locally during development. I think you don't want a "start" script there at all as Amplify would look in your public folder and serve the index.html file there.
Upvotes: 0
Reputation: 406
A quick fix that did work for me is to install @vue/cli-service
globally with this command npm install -g @vue/cli-service
Also make sure your npm install
command runs in NODE_ENV=development
otherwise devDependencies
won't be installed.
Upvotes: 5
Reputation: 91
You may want to use npm ci
or to trash your node_modules
, at least once just as a test. Seems like most CICD systems hitting this issue were resolved by destroying the node_modules artifact: https://github.com/vuejs/vue-cli/issues/2404
Upvotes: 0