Webpack error after following "5min Quickstart"

[johnstoia]

I have been following the "Angular – 5min quickstart" located at https://mdbootstrap.com/angular/5min-quickstart/

I have followed the guide exactly including the prerequisites.

Everything seems to work fine up until "Step 10" (compiling) where I get this error.

Invalid configuration object. Webpack has been initialised using a configuration object that does not match the API schema.
 - configuration.entry should be one of these:
   object { <key>: non-empty string | [non-empty string] } | non-empty string | [non-empty string] | function
   -> The entry point(s) of the compilation.
   Details:
    * configuration.entry['styles'] should be a string.
      -> The string is resolved to a module which is loaded upon startup.
    * configuration.entry['styles'] should not contain the item 'C:\Users\username\Documents\MDBTest\src\styles.scss' twice.
    * configuration.entry should be a string.
      -> An entry point without name. The string is resolved to a module which is loaded upon startup.
    * configuration.entry should be an array:
      [non-empty string]
    * configuration.entry should be an instance of function
      -> A Function returning an entry object, an entry string, an entry array or a promise to these things.
WebpackOptionsValidationError: Invalid configuration object. Webpack has been initialised using a configuration object that does not match the API schema.
 - configuration.entry should be one of these:
   object { <key>: non-empty string | [non-empty string] } | non-empty string | [non-empty string] | function
   -> The entry point(s) of the compilation.
   Details:
    * configuration.entry['styles'] should be a string.
      -> The string is resolved to a module which is loaded upon startup.
    * configuration.entry['styles'] should not contain the item 'C:\Users\<username>\Documents\MDBTest\src\styles.scss' twice.
    * configuration.entry should be a string.
      -> An entry point without name. The string is resolved to a module which is loaded upon startup.
    * configuration.entry should be an array:
      [non-empty string]
    * configuration.entry should be an instance of function
      -> A Function returning an entry object, an entry string, an entry array or a promise to these things.
    at webpack (C:\Users\username\Documents\MDBTest\node_modules\webpack\lib\webpack.js:19:9)
    at Class.run (C:\Users\username\Documents\MDBTest\node_modules\@angular\cli\tasks\serve.js:151:27)
    at check_port_1.checkPort.then.port (C:\Users\usernae\Documents\MDBTest\node_modules\@angular\cli\commands\serve.js:123:26)
    at <anonymous>
    at process._tickCallback (internal/process/next_tick.js:160:7)

I have looked everywhere online trying to figure out why this is happening but I cannot seem to figure it out. I would appreciate any help. Thanks.

[Bloodcast69]

Dear Johnstoia could you provide me your package.json file and your environment configuration? Angular version, system version etc? Best Regards, Damian

[johnstoia]

Hello again,

I actually fixed my error. In Step 7 where it says

Step 7: add below lines to angular-cli.json:

"styles": [
    "../node_modules/font-awesome/scss/font-awesome.scss",
    "../node_modules/angular-bootstrap-md/scss/bootstrap/bootstrap.scss",
    "../node_modules/angular-bootstrap-md/scss/mdb-free.scss",
    "./styles.scss"
],

I did not realize I was supposed to delete the "styles.scss" already input by the angular CLI.

After that everything works great.

Thanks!