sass：node_modules/ionic-angular/themes/ionic.functions.scss

Question

离子科尔多瓦构建时出错

sass: node_modules/ionic-angular/themes/ionic.functions.scss

完全错误：

[11:34:50]  sass started ...
[11:34:51]  sass: node_modules/ionic-angular/themes/ionic.functions.scss, line: 35
            The map color `contentbg` is not defined. Please make sure the color exists in your `$colors` map. For
            example: $colors: ( contentbg: #327eff );

      L35:    @error $error-msg;

[11:34:51]  ionic-app-script task: "build"
[11:34:51]  Error: Failed to render sass to css
Error: Failed to render sass to css
    at new BuildError (/Users/anand/projects/Ionic/ShoppingCart/PilotProject/ionic-firebase-login/node_modules/@ionic/app-scripts/dist/util/errors.js:16:28)
    at Object.callback (/Users/anand/projects/Ionic/ShoppingCart/PilotProject/ionic-firebase-login/node_modules/@ionic/app-scripts/dist/sass.js:210:24)
    at options.error (/Users/anand/projects/Ionic/ShoppingCart/PilotProject/ionic-firebase-login/node_modules/node-sass/lib/index.js:294:32)
[ERROR] An error occurred while running subprocess ionic-app-scripts.

        ionic-app-scripts build --target cordova --platform android exited with exit code 1.

        Re-running this command with the --verbose flag may provide more information.

// 包.json 这是我的 package.json

{
  "name": "ionic-firebase-cart",
  "version": "0.0.1",
  "author": "IonicThemes",
  "homepage": "https://ionicthemes.com/",
  "private": true,
  "scripts": {
    "clean": "ionic-app-scripts clean",
    "build": "ionic-app-scripts build",
    "lint": "ionic-app-scripts lint",
    "ionic:build": "ionic-app-scripts build",
    "ionic:serve": "ionic-app-scripts serve"
  },
  "dependencies": {
    "@angular/animations": "5.2.10",
    "@angular/common": "5.2.10",
    "@angular/compiler": "5.2.10",
    "@angular/compiler-cli": "5.2.10",
    "@angular/core": "5.2.10",
    "@angular/forms": "5.2.10",
    "@angular/http": "5.2.10",
    "@angular/platform-browser": "5.2.10",
    "@angular/platform-browser-dynamic": "5.2.10",
    "@ionic-native/core": "4.4.0",
    "@ionic-native/facebook": "^4.20.0",
    "@ionic-native/google-plus": "^4.20.0",
    "@ionic-native/splash-screen": "4.4.0",
    "@ionic-native/status-bar": "4.4.0",
    "@ionic-native/twitter-connect": "^4.20.0",
    "@ionic-native/vibration": "^5.3.0",
    "@ionic/storage": "2.1.3",
    "angular2-tag-input": "^1.2.3",
    "angularfire2": "^5.1.2",
    "cordova-android": "6.4.0",
    "cordova-ios": "^4.5.5",
    "cordova-plugin-browsertab": "0.2.0",
    "cordova-plugin-buildinfo": "2.0.2",
    "cordova-plugin-compat": "1.2.0",
    "cordova-plugin-device": "^2.0.2",
    "cordova-plugin-facebook4": "^1.10.1",
    "cordova-plugin-googleplus": "^5.3.2",
    "cordova-plugin-inappbrowser": "3.0.0",
    "cordova-plugin-ionic-keyboard": "^2.1.3",
    "cordova-plugin-ionic-webview": "^1.2.1",
    "cordova-plugin-splashscreen": "^5.0.2",
    "cordova-plugin-vibration": "^3.1.0",
    "cordova-plugin-whitelist": "^1.3.3",
    "cordova-universal-links-plugin": "~1.2.1",
    "cordova-universal-links-plugin-fix": "1.2.1",
    "firebase": "^5.9.2",
    "ionic-angular": "3.9.2",
    "ionic-native": "^2.9.0",
    "ionicons": "3.0.0",
    "promise-polyfill": "8.1.0",
    "rxfire": "^3.3.5",
    "rxjs": "6.3.3",
    "rxjs-compat": "6.3.3",
    "sw-toolbox": "3.6.0",
    "twitter-connect-plugin": "git+https://github.com/chroa/twitter-connect-plugin.git",
    "zone.js": "0.8.18"
  },
  "devDependencies": {
    "@ionic/app-scripts": "^3.2.3",
    "@ionic/lab": "1.0.15",
    "typescript": "2.4.2"
  },
  "description": "An Ionic project",
  "cordova": {
    "platforms": [
      "ios",
      "android"
    ],
    "plugins": {
      "cordova-plugin-device": {},
      "cordova-plugin-facebook4": {
        "APP_ID": "186848361921511",
        "APP_NAME": "myApplication"
      },
      "cordova-plugin-googleplus": {
        "REVERSED_CLIENT_ID": "com.googleusercontent.apps.1054364409223-ce6upclbeq8pmhkn4"
      },
      "cordova-plugin-ionic-keyboard": {},
      "cordova-plugin-ionic-webview": {},
      "cordova-plugin-splashscreen": {},
      "cordova-plugin-whitelist": {},
      "twitter-connect-plugin": {
        "FABRIC_KEY": "dbf48d8f78bb37d7792891eb24607",
        "TWITTER_KEY": "kMV673U1X4CduYL",
        "TWITTER_SECRET": "mb03DWehE5zRcb4g6Yl3tORCNy503rc4"
      },
      "cordova-plugin-buildinfo": {},
      "cordova-universal-links-plugin": {},
      "cordova-plugin-browsertab": {},
      "cordova-plugin-inappbrowser": {}
    }
  }
}

//

** 并且在此之后出现错误**

错误：无法将 sass 渲染到 css

    at new BuildError (/Users/anand/projects/Ionic/ShoppingCart/PilotProject/ionic-firebase-login/node_modules/@ionic/app-scripts/dist/util/errors.js:16:28)
    at Object.callback (/Users/anand/projects/Ionic/ShoppingCart/PilotProject/ionic-firebase-login/node_modules/@ionic/app-scripts/dist/sass.js:210:24)
    at options.error 

遇到错误

(/Users/anand/projects/Ionic/ShoppingCart/PilotProject/ionic-firebase-login/node_modules/node-sass/lib/index.js:294:32) [ERROR] 运行子进程 ionic-app-scripts 时出错。

Answer 1

在您的 Sass 文件中的某个位置，您将 contentbg 指定为颜色名称，

如果你是认真的，你应该考虑将它添加到src/theme/variables.scss 中的$colors 变量中

$colors: (
  primary: #488aff,
  secondary: #32db64,
  danger: #f53d3d,
  light: #f4f4f4,
  contentbg: #21b8ff <<-------
);

考虑查看有关应用主题化的 Ionic 文档：https://ionicframework.com/docs/v3/theming/theming-your-app/