#StackBounty: #azure #vue.js #azure-devops #azure-pipelines #vue-cli Can VUE CLI Run on be run/installed on Azure Pipelines?

Bounty: 100

I currently have our backend project running on azure pipelines and I would love to integrate our front-end VUE project in the same way. However, I have tried everything to get vue-cli-service installed/built on our pipeline to no avail. The same exact build commands work locally but will not work on the Azure VM. Our pipeline yaml file currently looks like this:

YAML

    trigger:
- main
pool:
  vmImage: 'ubuntu-latest'
steps:
- task: NodeTool@0
  inputs:
    versionSpec: '10.12'
  displayName: 'Install Node.js'
- script: |
    npm install -g @vue/cli@latest
    npm i -g @vue/cli-service-global
    npm install
    npm run build
    yarn global add @vue/cli && yarn build
    vue serve
  displayName: 'npm install and build'

As you can see I have tried various methods to get vue-cli installed/built but I get the same error every time:

The Output:

yarn global v1.22.10
[1/4] Resolving packages...
warning @vue/cli > @vue/cli-shared-utils > request@2.88.2: request has been deprecated, see https://github.com/request/request/issues/3142
warning @vue/cli > @vue/cli-shared-utils > @hapi/joi@15.1.1: Switch to 'npm install joi'
warning @vue/cli > @vue/cli-shared-utils > request > har-validator@5.1.5: this library is no longer supported
warning @vue/cli > @vue/cli-shared-utils > request > uuid@3.4.0: Please upgrade  to version 7 or higher.  Older versions may use Math.random() in certain circumstances, which is known to be problematic.  See https://v8.dev/blog/math-random for details.
warning @vue/cli > @vue/cli-shared-utils > @hapi/joi > @hapi/hoek@8.5.1: This version has been deprecated and is no longer supported or maintained
warning @vue/cli > @vue/cli-shared-utils > @hapi/joi > @hapi/topo@3.1.6: This version has been deprecated and is no longer supported or maintained
warning @vue/cli > @vue/cli-shared-utils > @hapi/joi > @hapi/topo > @hapi/hoek@8.5.1: This version has been deprecated and is no longer supported or maintained
warning @vue/cli > @vue/cli-shared-utils > @hapi/joi > @hapi/bourne@1.3.2: This version has been deprecated and is no longer supported or maintained
warning @vue/cli > @vue/cli-shared-utils > @hapi/joi > @hapi/address@2.1.4: Moved to 'npm install @sideway/address'
warning @vue/cli > @vue/cli-ui > apollo-server-express > graphql-tools > uuid@3.4.0: Please upgrade  to version 7 or higher.  Older versions may use Math.random() in certain circumstances, which is known to be problematic.  See https://v8.dev/blog/math-random for details.
warning @vue/cli > globby > fast-glob > micromatch > snapdragon > source-map-resolve > resolve-url@0.2.1: https://github.com/lydell/resolve-url#deprecated
warning @vue/cli > globby > fast-glob > micromatch > snapdragon > source-map-resolve > urix@0.1.0: Please see https://github.com/lydell/urix#deprecated
[2/4] Fetching packages...
[3/4] Linking dependencies...
[4/4] Building fresh packages...
success Installed "@vue/cli@4.5.13" with binaries:
      - vue
Done in 16.68s.
yarn run v1.22.10
$ vue-cli-service build
/bin/sh: 1: vue-cli-service: not found
error Command failed with exit code 127.
info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command.
Failed to locate entry file in /home/vsts/work/1/s.
Valid entry file should be one of: main.js, index.js, App.vue or app.vue.

There's a package.json in the current directory.
Did you mean yarn serve?
##[error]Bash exited with code '1'.
Finishing: npm install and build

The Error:

$ vue-cli-service build
/bin/sh: 1: vue-cli-service: not found
error Command failed with exit code 127.

package.json

{
  "name": "test-vue",
  "version": "0.1.0",
  "private": true,
  "scripts": {
    "serve": "vue-cli-service serve",
    "build": "vue-cli-service build",
    "lint": "vue-cli-service lint"
  },
  "dependencies": {
    "@fortawesome/fontawesome-svg-core": "^1.2.18",
    "@fortawesome/free-brands-svg-icons": "^5.8.2",
    "@fortawesome/pro-light-svg-icons": "^5.8.2",
    "@fortawesome/pro-regular-svg-icons": "^5.8.2",
    "@fortawesome/pro-solid-svg-icons": "^5.8.2",
    "@fortawesome/vue-fontawesome": "^0.1.6",
    "add": "^2.0.6",
    "axios": "^0.18.0",
    "bootstrap": "^4.3.1",
    "chart.js": "^2.8.0",
    "core-js": "^2.6.5",
    "moment": "^2.24.0",
    "node-sass": "^4.12.0",
    "popper.js": "^1.15.0",
    "v-calendar": "^1.0.0-beta.16",
    "vee-validate": "^2.2.11",
    "vue": "^2.6.10",
    "vue-chartjs": "^3.4.2",
    "vue-class-component": "^7.0.2",
    "vue-directive-tooltip": "^1.6.2",
    "vue-popperjs": "^2.0.4",
    "vue-router": "^3.0.6",
    "vuex": "^3.0.0",
    "vuex-class": "^0.3.2",
    "vuex-module-decorators": "^0.9.9",
    "webpack": "4.0.0",
    "yarn": "^1.16.0"
  },
  "devDependencies": {
    "@vue/cli-plugin-babel": "^3.7.0",
    "@vue/cli-plugin-eslint": "^3.7.0",
    "@vue/cli-plugin-typescript": "^3.7.0",
    "@vue/cli-service": "^3.7.0",
    "@vue/eslint-config-typescript": "^4.0.0",
    "babel-eslint": "^10.0.1",
    "eslint": "^5.16.0",
    "eslint-plugin-vue": "^5.0.0",
    "sass": "^1.20.1",
    "sass-loader": "^7.1.0",
    "ts-loader": "^6.0.1",
    "typescript": "3.4.5",
    "vue-property-decorator": "^8.1.1",
    "vue-template-compiler": "^2.5.21"
  },
  "eslintConfig": {
    "root": true,
    "env": {
      "node": true
    },
    "extends": [
      "plugin:vue/essential",
      "eslint:recommended",
      "@vue/typescript"
    ],
    "rules": {},
    "parserOptions": {
      "parser": "@typescript-eslint/parser"
    }
  },
  "postcss": {
    "plugins": {
      "autoprefixer": {}
    }
  },
  "browserslist": [
    "> 1%",
    "last 2 versions"
  ]
}

I believe the issue is related to the script vue-cli-service build


Get this bounty!!!

Leave a Reply

This site uses Akismet to reduce spam. Learn how your comment data is processed.