Travis CI failing on with Angular Material

Question

I'm unable to get my travis ci build to pass. This is my first time using Travis and Angular 5 but I've read the docs and still cant seem to figure out what I'm missing, pretty sure it's something simple. ng build passes locally and only fails in the build. I'm thinking some how I'm not including angular material in my build but can't find anything on google about needing to include it or how to include it. I've included the .travis.yml and the error stack, any help is appreciated.

Build Error: ERROR in ./src/styles.css Module build failed: Error: Can't resolve '@angular/material/prebuilt-themes/indigo-pink.css' in '/home/travis/build/jearl4/portfolio/src' at onError (/home/travis/build/jearl4/portfolio/node_modules/enhanced-resolve/lib/Resolver.js:61:15) at loggingCallbackWrapper (/home/travis/build/jearl4/portfolio/node_modules/enhanced-resolve/lib/createInnerCallback.js:31:19) at runAfter (/home/travis/build/jearl4/portfolio/node_modules/enhanced-resolve/lib/Resolver.js:158:4) at innerCallback (/home/travis/build/jearl4/portfolio/node_modules/enhanced-resolve/lib/Resolver.js:146:3) at loggingCallbackWrapper (/home/travis/build/jearl4/portfolio/node_modules/enhanced-resolve/lib/createInnerCallback.js:31:19) at next (/home/travis/build/jearl4/portfolio/node_modules/tapable/lib/Tapable.js:252:11) at /home/travis/build/jearl4/portfolio/node_modules/enhanced-resolve/lib/UnsafeCachePlugin.js:40:4 at loggingCallbackWrapper (/home/travis/build/jearl4/portfolio/node_modules/enhanced-resolve/lib/createInnerCallback.js:31:19) at runAfter (/home/travis/build/jearl4/portfolio/node_modules/enhanced-resolve/lib/Resolver.js:158:4) at innerCallback (/home/travis/build/jearl4/portfolio/node_modules/enhanced-resolve/lib/Resolver.js:146:3) at loggingCallbackWrapper (/home/travis/build/jearl4/portfolio/node_modules/enhanced-resolve/lib/createInnerCallback.js:31:19) at next (/home/travis/build/jearl4/portfolio/node_modules/tapable/lib/Tapable.js:252:11) at innerCallback (/home/travis/build/jearl4/portfolio/node_modules/enhanced-resolve/lib/Resolver.js:144:11) at loggingCallbackWrapper (/home/travis/build/jearl4/portfolio/node_modules/enhanced-resolve/lib/createInnerCallback.js:31:19) at next (/home/travis/build/jearl4/portfolio/node_modules/tapable/lib/Tapable.js:249:35) at resolver.doResolve.createInnerCallback (/home/travis/build/jearl4/portfolio/node_modules/enhanced-resolve/lib/DescriptionFilePlugin.js:44:6) @ multi ./src/styles.css ERROR in ./src/styles.css Module build failed: ModuleBuildError: Module build failed: Error: Can't resolve '@angular/material/prebuilt-themes/indigo-pink.css' in '/home/travis/build/jearl4/portfolio/src' at onError (/home/travis/build/jearl4/portfolio/node_modules/enhanced-resolve/lib/Resolver.js:61:15) at loggingCallbackWrapper (/home/travis/build/jearl4/portfolio/node_modules/enhanced-resolve/lib/createInnerCallback.js:31:19) at runAfter (/home/travis/build/jearl4/portfolio/node_modules/enhanced-resolve/lib/Resolver.js:158:4) at innerCallback (/home/travis/build/jearl4/portfolio/node_modules/enhanced-resolve/lib/Resolver.js:146:3) at loggingCallbackWrapper (/home/travis/build/jearl4/portfolio/node_modules/enhanced-resolve/lib/createInnerCallback.js:31:19) at next (/home/travis/build/jearl4/portfolio/node_modules/tapable/lib/Tapable.js:252:11) at /home/travis/build/jearl4/portfolio/node_modules/enhanced-resolve/lib/UnsafeCachePlugin.js:40:4 at loggingCallbackWrapper (/home/travis/build/jearl4/portfolio/node_modules/enhanced-resolve/lib/createInnerCallback.js:31:19) at runAfter (/home/travis/build/jearl4/portfolio/node_modules/enhanced-resolve/lib/Resolver.js:158:4) at innerCallback (/home/travis/build/jearl4/portfolio/node_modules/enhanced-resolve/lib/Resolver.js:146:3) at loggingCallbackWrapper (/home/travis/build/jearl4/portfolio/node_modules/enhanced-resolve/lib/createInnerCallback.js:31:19) at next (/home/travis/build/jearl4/portfolio/node_modules/tapable/lib/Tapable.js:252:11) at innerCallback (/home/travis/build/jearl4/portfolio/node_modules/enhanced-resolve/lib/Resolver.js:144:11) at loggingCallbackWrapper (/home/travis/build/jearl4/portfolio/node_modules/enhanced-resolve/lib/createInnerCallback.js:31:19) at next (/home/travis/build/jearl4/portfolio/node_modules/tapable/lib/Tapable.js:249:35) at resolver.doResolve.createInnerCallback (/home/travis/build/jearl4/portfolio/node_modules/enhanced-resolve/lib/DescriptionFilePlugin.js:44:6) at runLoaders (/home/travis/build/jearl4/portfolio/node_modules/webpack/lib/NormalModule.js:195:19) at /home/travis/build/jearl4/portfolio/node_modules/loader-runner/lib/LoaderRunner.js:364:11 at /home/travis/build/jearl4/portfolio/node_modules/loader-runner/lib/LoaderRunner.js:230:18 at context.callback (/home/travis/build/jearl4/portfolio/node_modules/loader-runner/lib/LoaderRunner.js:111:13) at Promise.resolve.then.then.catch (/home/travis/build/jearl4/portfolio/node_modules/postcss-loader/lib/index.js:198:71) at process._tickCallback (internal/process/next_tick.js:103:7) @ ./src/styles.css @ multi ./src/styles.css ERROR in app/material.module.ts(5,15): Error during template compile of 'MaterialModule' Could not resolve @angular/material relative to /home/travis/build/jearl4/portfolio/src/app/material.module.ts.. src/app/material.module.ts(3,51): error TS2307: Cannot find module '@angular/material'.

.travis.yml

sudo: required  
dist: trusty

language: node_js
node_js:
  - "6.9"

before_install:  
 - export CHROME_BIN=/usr/bin/google-chrome
 - export DISPLAY=:99.0 
 - sh -e /etc/init.d/xvfb start
 - sudo apt-get update
 - sudo apt-get install -y libappindicator1 fonts-liberation
 - wget https://dl.google.com/linux/direct/google-chrome- 
stable_current_amd64.deb
 - sudo dpkg -i google-chrome*.deb

before_script:
  - npm install -g firebase-tools
  - npm install -g @angular/cli

script:
  - ng build --prod

after_success:
  - firebase deploy --token $FIREBASE_TOKEN

notifications:
  email:
    on_failure: change
    on_success: change

Answer 1

I think you missed project modules installation. Try to add line below to your before_script section:

- npm install

If you have correct dependencies in package.json it will be installed automatically, if not then you need to add angular-material and its dependencies to your package.json. It can be done by running command below:

npm install --save @angular/material @angular/cdk

Don't forget to commit your changes into your repository.