CI 由于 node-sass 而失败,在 Ionic 4 和 nodeV12 上

CI failed because of node-sass, on Ionic 4 and nodeV12

我在开发过程中遇到了一个问题ci,我使用 ionic v4 开发了一个应用程序,并且在 Gitlab 上进行了持续集成测试。在本地我的测试和构建通过了,但是在服务器端 ci 它失败了。 第一次,我有一个错误是:

Module build failed (from ./node_modules/sass-loader/lib/loader.js):
Error: Cannot find module 'node-sass'

在那之后我的 .gitlab-ci.yml 做了很多改变,比如

我尝试了所有顺序但都失败了,经过更多研究我发现服务器没有相同的节点和 npm 版本,所以我在本地将我这边更新为相同的版本:

C:\Users\Ludovic\Documents\gototalentMobile>node -v
v12.13.1

C:\Users\Ludovic\Documents\gototalentMobile>npm -v
6.12.0

在那之后我的 ci 总是失败,我看到有一个离子脚本(或 angular)一直执行并安装一个 node-sass 版本与节点 12 不兼容:

> node-sass@4.10.0 install /builds/hrit/gototalentMobile/node_modules/@angular-devkit/build-angular/node_modules/node-sass
> node scripts/install.js

Downloading binary from https://github.com/sass/node-sass/releases/download/v4.10.0/linux-x64-72_binding.node
Cannot download "https://github.com/sass/node-sass/releases/download/v4.10.0/linux-x64-72_binding.node": 

HTTP error 404 Not Found

这里的问题是我不知道这个脚本在哪里,我尝试了很多东西来在我的依赖项cies 中安装 node-sassV12+,但它总是创建一个依赖项到我的包中的 V10-lock.json。我认为问题出在这里,node-sass@10.0.0 不能与 NodeV12 一起使用,但我不知道在哪里更改它。

我把我所有的信息都放在这里:

离子科尔多瓦

C:\Users\Ludovic\Documents\gototalentMobile>ionic info

Ionic:

   ionic (Ionic CLI)             : 4.4.0 (C:\Users\Ludovic\node_modules\ionic)
   Ionic Framework               : @ionic/angular 4.11.5
   @angular-devkit/build-angular : 0.12.4
   @angular-devkit/schematics    : 7.2.4
   @angular/cli                  : 7.2.4
   @ionic/angular-toolkit        : 1.4.1

Cordova:

   cordova (Cordova CLI) : 8.1.2 (cordova-lib@8.1.1)
   Cordova Platforms     : android 7.1.1, ios 5.0.0
   Cordova Plugins       : not available

System:

   NodeJS : v12.13.1 (C:\Program Files\nodejs\node.exe)
   npm    : 6.12.0
   OS     : Windows 7

package.json

{
  "name": "talentmoovmobile",
  "version": "1.0.0",
  "author": "Ionic Framework",
  "homepage": "https://ionicframework.com/",
  "scripts": {
    "ng": "ng",
    "start": "ng serve",
    "build": "ng build",
    "test": "ng test",
    "lint": "ng lint",
    "e2e": "ng e2e",
    "dev": "ionic cordova run android --device",
    "ci-staging-build": "ng build --configuration=staging",
    "staging": "ionic cordova run android --configuration=staging --device",
    "test-ci": "ng test --watch=false"
  },
  "private": true,
  "dependencies": {
    "@angular/animations": "^7.2.9",
    "@angular/cdk": "^7.3.4",
    "@angular/common": "^7.2.2",
    "@angular/core": "^7.2.2",
    "@angular/forms": "^7.2.2",
    "@angular/http": "^7.2.2",
    "@angular/material": "^7.3.4",
    "@angular/platform-browser": "^7.2.2",
    "@angular/platform-browser-dynamic": "^7.2.2",
    "@angular/router": "^7.2.2",
    "@fortawesome/angular-fontawesome": "^0.3.0",
    "@fortawesome/fontawesome-svg-core": "^1.2.17",
    "@fortawesome/free-regular-svg-icons": "^5.8.1",
    "@ionic-native/call-number": "^5.10.0",
    "@ionic-native/camera": "^5.2.0",
    "@ionic-native/core": "^5.0.0",
    "@ionic-native/email-composer": "^5.10.0",
    "@ionic-native/file": "^5.4.0",
    "@ionic-native/file-opener": "^5.10.0",
    "@ionic-native/local-notifications": "^5.3.0",
    "@ionic-native/screen-orientation": "^5.13.0",
    "@ionic-native/splash-screen": "^5.0.0",
    "@ionic-native/status-bar": "^5.0.0",
    "@ionic/angular": "^4.1.1",
    "@ionic/storage": "latest",
    "@stomp/ng2-stompjs": "^7.2.0",
    "@types/sockjs-client": "^1.1.1",
    "angular-calendar": "^0.27.1",
    "call-number": "1.0.1",
    "chart.js": "^2.8.0",
    "cordova": "^8.1.2",
    "cordova-android": "7.1.1",
    "cordova-ios": "5.0.0",
    "cordova-plugin-add-swift-support": "1.7.2",
    "cordova-plugin-badge": "0.8.8",
    "cordova-plugin-camera": "4.0.3",
    "cordova-plugin-chooser": "1.2.5",
    "cordova-plugin-device": "^2.0.2",
    "cordova-plugin-email-composer": "0.9.2",
    "cordova-plugin-file": "6.0.1",
    "cordova-plugin-file-opener2": "2.2.1",
    "cordova-plugin-filechooser": "1.2.0",
    "cordova-plugin-ionic-keyboard": "^2.1.3",
    "cordova-plugin-ionic-webview": "^3.1.2",
    "cordova-plugin-local-notification": "0.9.0-beta.2",
    "cordova-plugin-screen-orientation": "3.0.2",
    "cordova-plugin-splashscreen": "^5.0.2",
    "cordova-plugin-statusbar": "^2.4.2",
    "cordova-plugin-whitelist": "^1.3.3",
    "core-js": "^2.5.4",
    "date-fns": "^1.30.1",
    "ion2-calendar": "^3.0.0-rc.0",
    "ionic4-rating": "^1.0.9",
    "moment": "^2.24.0",
    "mx.ferreyra.callnumber": "0.0.2",
    "node-gyp": "^6.0.1",
    "node-sass": "^4.13.0",
    "rxjs": "~6.3.3",
    "rxjs-compat": "^6.4.0",
    "sockjs-client": "^1.3.0",
    "zone.js": "~0.8.29"
  },
  "devDependencies": {
    "@angular-devkit/architect": "~0.12.3",
    "@angular-devkit/build-angular": "~0.12.3",
    "@angular-devkit/core": "~7.2.3",
    "@angular-devkit/schematics": "~7.2.3",
    "@angular/cli": "~7.2.3",
    "@angular/compiler": "~7.2.2",
    "@angular/compiler-cli": "~7.2.2",
    "@angular/language-service": "~7.2.2",
    "@fortawesome/fontawesome-free": "^5.8.1",
    "@ionic/angular-toolkit": "~1.4.0",
    "@types/jasmine": "~2.8.8",
    "@types/jasminewd2": "~2.0.3",
    "@types/node": "~10.12.0",
    "codelyzer": "~4.5.0",
    "jasmine-core": "~2.99.1",
    "jasmine-spec-reporter": "~4.2.1",
    "karma": "~3.1.4",
    "karma-chrome-launcher": "~2.2.0",
    "karma-coverage-istanbul-reporter": "~2.0.1",
    "karma-jasmine": "~1.1.2",
    "karma-jasmine-html-reporter": "^0.2.2",
    "protractor": "~5.4.0",
    "ts-node": "~8.0.0",
    "tslint": "~5.12.0",
    "typescript": "~3.1.6"
  },
  "description": "An Ionic project",
  "cordova": {
    "plugins": {
      "cordova-plugin-whitelist": {},
      "cordova-plugin-statusbar": {},
      "cordova-plugin-device": {},
      "cordova-plugin-splashscreen": {},
      "cordova-plugin-ionic-webview": {
        "ANDROID_SUPPORT_ANNOTATIONS_VERSION": "27.+"
      },
      "cordova-plugin-ionic-keyboard": {},
      "cordova-plugin-camera": {},
      "cordova-plugin-filechooser": {},
      "cordova-plugin-chooser": {},
      "cordova-plugin-local-notification": {},
      "cordova-plugin-file": {},
      "cordova-plugin-email-composer": {
        "ANDROID_SUPPORT_V4_VERSION": "27.+"
      },
      "mx.ferreyra.callnumber": {},
      "cordova-plugin-file-opener2": {
        "ANDROID_SUPPORT_V4_VERSION": "27.+"
      },
      "cordova-plugin-screen-orientation": {},
      "call-number": {}
    },
    "platforms": [
      "ios",
      "android"
    ]
  }
}

实际的 .gitlab-ci.yml 也失败了

# https://gitlab.com/ci/lint
# https://gitlab.com/ci/lint
# This image is based from node and includes what we need to run tests with Chrome headless
image: weboaks/node-karma-protractor-chrome:headless

variables:

stages:
  - test
  - build

test:
  stage: test
  script:
    - npm install --unsafe-perm node-sass@4.13.0
    - npm cache clean --force
    - npm install --ignore-scripts
    - npm run test-ci
  tags:
    - pages

build:
  stage: build
  script:
    - npm install --unsafe-perm node-sass@4.13.0
    - npm cache clean --force
    - npm install --ignore-scripts
    - npm run ci-staging-build
  tags:
    - pages
  dependencies:
    - test

config.xml

<?xml version='1.0' encoding='utf-8'?>
<widget id="fr.hritconsulting.talentmoov" version="1.0.0" xmlns="http://www.w3.org/ns/widgets" xmlns:cdv="http://cordova.apache.org/ns/1.0">
    <name>TalentMoov</name>
    <description>From HR'IT Consulting Teams.</description>
    <author email="contact@hr-itconsulting.com" href="https://www.hr-itconsulting.com/">HR'IT Consulting WebSite</author>
    <content src="index.html" />
    <access origin="*" />
    <allow-intent href="http://*/*" />
    <allow-intent href="https://*/*" />
    <allow-intent href="tel:*" />
    <allow-intent href="sms:*" />
    <allow-intent href="mailto:*" />
    <allow-intent href="geo:*" />
    <preference name="ScrollEnabled" value="false" />
    <preference name="android-minSdkVersion" value="19" />
    <preference name="BackupWebStorage" value="none" />
    <preference name="SplashMaintainAspectRatio" value="true" />
    <preference name="FadeSplashScreenDuration" value="300" />
    <preference name="SplashShowOnlyFirstTime" value="false" />
    <preference name="SplashScreen" value="screen" />
    <preference name="SplashScreenDelay" value="3000" />
    <platform name="android">
        <allow-intent href="market:*" />
        <icon density="ldpi" src="resources/android/icon/drawable-ldpi-icon.png" />
        <icon density="mdpi" src="resources/android/icon/drawable-mdpi-icon.png" />
        <icon density="hdpi" src="resources/android/icon/drawable-hdpi-icon.png" />
        <icon density="xhdpi" src="resources/android/icon/drawable-xhdpi-icon.png" />
        <icon density="xxhdpi" src="resources/android/icon/drawable-xxhdpi-icon.png" />
        <icon density="xxxhdpi" src="resources/android/icon/drawable-xxxhdpi-icon.png" />
        <splash density="land-ldpi" src="resources/android/splash/drawable-land-ldpi-screen.png" />
        <splash density="land-mdpi" src="resources/android/splash/drawable-land-mdpi-screen.png" />
        <splash density="land-hdpi" src="resources/android/splash/drawable-land-hdpi-screen.png" />
        <splash density="land-xhdpi" src="resources/android/splash/drawable-land-xhdpi-screen.png" />
        <splash density="land-xxhdpi" src="resources/android/splash/drawable-land-xxhdpi-screen.png" />
        <splash density="land-xxxhdpi" src="resources/android/splash/drawable-land-xxxhdpi-screen.png" />
        <splash density="port-ldpi" src="resources/android/splash/drawable-port-ldpi-screen.png" />
        <splash density="port-mdpi" src="resources/android/splash/drawable-port-mdpi-screen.png" />
        <splash density="port-hdpi" src="resources/android/splash/drawable-port-hdpi-screen.png" />
        <splash density="port-xhdpi" src="resources/android/splash/drawable-port-xhdpi-screen.png" />
        <splash density="port-xxhdpi" src="resources/android/splash/drawable-port-xxhdpi-screen.png" />
        <splash density="port-xxxhdpi" src="resources/android/splash/drawable-port-xxxhdpi-screen.png" />
    </platform>
    <platform name="ios">
        <allow-intent href="itms:*" />
        <allow-intent href="itms-apps:*" />
        <icon height="57" src="resources/ios/icon/icon.png" width="57" />
        <icon height="114" src="resources/ios/icon/icon@2x.png" width="114" />
        <icon height="40" src="resources/ios/icon/icon-40.png" width="40" />
        <icon height="80" src="resources/ios/icon/icon-40@2x.png" width="80" />
        <icon height="120" src="resources/ios/icon/icon-40@3x.png" width="120" />
        <icon height="50" src="resources/ios/icon/icon-50.png" width="50" />
        <icon height="100" src="resources/ios/icon/icon-50@2x.png" width="100" />
        <icon height="60" src="resources/ios/icon/icon-60.png" width="60" />
        <icon height="120" src="resources/ios/icon/icon-60@2x.png" width="120" />
        <icon height="180" src="resources/ios/icon/icon-60@3x.png" width="180" />
        <icon height="72" src="resources/ios/icon/icon-72.png" width="72" />
        <icon height="144" src="resources/ios/icon/icon-72@2x.png" width="144" />
        <icon height="76" src="resources/ios/icon/icon-76.png" width="76" />
        <icon height="152" src="resources/ios/icon/icon-76@2x.png" width="152" />
        <icon height="167" src="resources/ios/icon/icon-83.5@2x.png" width="167" />
        <icon height="29" src="resources/ios/icon/icon-small.png" width="29" />
        <icon height="58" src="resources/ios/icon/icon-small@2x.png" width="58" />
        <icon height="87" src="resources/ios/icon/icon-small@3x.png" width="87" />
        <icon height="1024" src="resources/ios/icon/icon-1024.png" width="1024" />
        <splash height="1136" src="resources/ios/splash/Default-568h@2x~iphone.png" width="640" />
        <splash height="1334" src="resources/ios/splash/Default-667h.png" width="750" />
        <splash height="2208" src="resources/ios/splash/Default-736h.png" width="1242" />
        <splash height="1242" src="resources/ios/splash/Default-Landscape-736h.png" width="2208" />
        <splash height="1536" src="resources/ios/splash/Default-Landscape@2x~ipad.png" width="2048" />
        <splash height="2048" src="resources/ios/splash/Default-Landscape@~ipadpro.png" width="2732" />
        <splash height="768" src="resources/ios/splash/Default-Landscape~ipad.png" width="1024" />
        <splash height="2048" src="resources/ios/splash/Default-Portrait@2x~ipad.png" width="1536" />
        <splash height="2732" src="resources/ios/splash/Default-Portrait@~ipadpro.png" width="2048" />
        <splash height="1024" src="resources/ios/splash/Default-Portrait~ipad.png" width="768" />
        <splash height="960" src="resources/ios/splash/Default@2x~iphone.png" width="640" />
        <splash height="480" src="resources/ios/splash/Default~iphone.png" width="320" />
        <splash height="2732" src="resources/ios/splash/Default@2x~universal~anyany.png" width="2732" />
    </platform>
    <plugin name="cordova-plugin-whitelist" spec="1.3.3" />
    <plugin name="cordova-plugin-statusbar" spec="2.4.2" />
    <plugin name="cordova-plugin-device" spec="2.0.2" />
    <plugin name="cordova-plugin-splashscreen" spec="5.0.2" />
    <plugin name="cordova-plugin-ionic-webview" spec="^3.0.0" />
    <plugin name="cordova-plugin-ionic-keyboard" spec="^2.0.5" />
    <plugin name="cordova-plugin-camera" spec="4.0.3" />
    <plugin name="cordova-plugin-chooser" spec="1.2.5" />
    <plugin name="cordova-plugin-filechooser" spec="1.2.0" />
    <plugin name="cordova-plugin-local-notification" spec="0.9.0-beta.2" />
    <plugin name="cordova-plugin-file" spec="6.0.1" />
    <plugin name="cordova-plugin-email-composer" spec="0.9.2">
        <variable name="ANDROID_SUPPORT_V4_VERSION" value="27.+" />
    </plugin>
    <plugin name="mx.ferreyra.callnumber" spec="~0.0.2" />
    <plugin name="cordova-plugin-file-opener2" spec="2.2.1">
        <variable name="ANDROID_SUPPORT_V4_VERSION" value="27.+" />
    </plugin>
    <plugin name="cordova-plugin-screen-orientation" spec="3.0.2" />
    <engine name="ios" spec="5.0.0" />
    <engine name="android" spec="7.1.1" />
</widget>

我在这个问题上被封锁很多天了。我现在需要你的帮助,感谢你的回答!

我之前遇到过同样的问题。

Node-sass 是@angular-devkit/build-angular 的依赖项,因此如果将其版本更改为 0.13.9,它将需要 Node-sass 4.12.0,然后它应该没问题。

"dependencies": {
    "@angular-devkit/build-angular": "^0.13.9",
...
}

让我知道这是否适合你

@Monomachus 更新依赖后的错误是:

$ npm run test-ci

> talentmoovmobile@1.0.0 test-ci /builds/hrit/gototalentMobile
> ng test --watch=false

03 12 2019 13:32:37.154:INFO [karma-server]: Karma v3.1.4 server started at http://0.0.0.0:9876/
03 12 2019 13:32:37.162:INFO [launcher]: Launching browsers ChromeCI with concurrency unlimited
03 12 2019 13:32:37.205:INFO [launcher]: Starting browser ChromiumHeadless
03 12 2019 13:33:32.531:INFO [HeadlessChrome 78.0.3904 (Linux 0.0.0)]: Connected on socket YJ3SzogXy4FFB2VGAAAA with id 69484878
03 12 2019 13:34:05.648:WARN [HeadlessChrome 78.0.3904 (Linux 0.0.0)]: Disconnected (0 times), because no message in 30000 ms.
HeadlessChrome 78.0.3904 (Linux 0.0.0) ERROR
  Disconnected, because no message in 30000 ms.

HeadlessChrome 78.0.3904 (Linux 0.0.0) ERROR
  Disconnected, because no message in 30000 ms.

03 12 2019 13:34:22.775:WARN [launcher]: ChromiumHeadless was not killed in 2000 ms, sending SIGKILL.
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! talentmoovmobile@1.0.0 test-ci: `ng test --watch=false`
npm ERR! Exit status 1
npm ERR! 
npm ERR! Failed at the talentmoovmobile@1.0.0 test-ci script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.

npm ERR! A complete log of this run can be found in:
npm ERR!     /home/node/.npm/_logs/2019-12-03T13_34_37_826Z-debug.log
ERROR: Job failed: exit code 1