Cannot build this Angular project

Question

I downloaded one Angular project from the Internet with an Angular select component.

Here is the original example:

https://material.angular.io/components/select/overview#resetting-the-select-value

They have a demo on the following link:

https://stackblitz.com/angular/qodvbqymxae

I downloaded that demo to my computer, but when doing:

$ ng serve

I get the error:

ERROR in Error: Tried to find bootstrap code, but could not. Specify either statically analyzable bootstrap code or pass in an entryModule to the plugins options.
    at Object.resolveEntryModuleFromMain (D:\_System\Hatuey\Desktop\angular-material-select\node_modules\@ngtools\webpack\src\entry_resolver.js:131:11)
    at Promise.resolve.then.then (D:\_System\Hatuey\Desktop\angular-material-select\node_modules\@ngtools\webpack\src\angular_compiler_plugin.js:239:54)
    at process._tickCallback (internal/process/next_tick.js:109:7)

as you can see on the following full output:

** NG Live Development Server is listening on localhost:4200, open your browser on http://localhost:4200/ **
Date: 2018-01-07T09:15:56.348Z
Hash: 93425b9cdaae6fb908b2
Time: 10331ms
chunk {inline} inline.bundle.js (inline) 5.79 kB [entry] [rendered]
chunk {main} main.bundle.js (main) 2.93 kB [initial] [rendered]
chunk {polyfills} polyfills.bundle.js (polyfills) 636 bytes [initial] [rendered]
chunk {styles} styles.bundle.js (styles) 154 kB [initial] [rendered]
chunk {vendor} vendor.bundle.js (vendor) 854 kB [initial] [rendered]

ERROR in Error: Tried to find bootstrap code, but could not. Specify either statically analyzable bootstrap code or pass in an entryModule to the plugins options.
    at Object.resolveEntryModuleFromMain (D:\_System\Hatuey\Desktop\angular-material-select\node_modules\@ngtools\webpack\src\entry_resolver.js:131:11)
    at Promise.resolve.then.then (D:\_System\Hatuey\Desktop\angular-material-select\node_modules\@ngtools\webpack\src\angular_compiler_plugin.js:239:54)
    at process._tickCallback (internal/process/next_tick.js:109:7)

webpack: Failed to compile.
webpack: Compiling...
Date: 2018-01-07T09:15:58.101Z
Hash: c2a123371dfcb5513a4e
Time: 884ms
chunk {inline} inline.bundle.js (inline) 5.79 kB [entry]
chunk {main} main.bundle.js (main) 2.93 kB [initial]
chunk {polyfills} polyfills.bundle.js (polyfills) 636 bytes [initial]
chunk {styles} styles.bundle.js (styles) 154 kB [initial]
chunk {vendor} vendor.bundle.js (vendor) 854 kB [initial]

ERROR in Error: Tried to find bootstrap code, but could not. Specify either statically analyzable bootstrap code or pass in an entryModule to the plugins options.
    at Object.resolveEntryModuleFromMain (D:\_System\Hatuey\Desktop\angular-material-select\node_modules\@ngtools\webpack\src\entry_resolver.js:131:11)
    at Promise.resolve.then.then (D:\_System\Hatuey\Desktop\angular-material-select\node_modules\@ngtools\webpack\src\angular_compiler_plugin.js:239:54)
    at process._tickCallback (internal/process/next_tick.js:109:7)

webpack: Failed to compile.

On the README.md file provided by: stackblitz.com (when export) they say:

This project was generated with Angular CLI version 1.2.1.

On my local computer I get the following:

$ ng version
...
Angular CLI: 1.5.4
Node: 6.11.2
OS: win32 x64
Angular: 5.1.3
...

If you want to try by yourself, you can do:

$ mkdir angular-material-select
$ cd angular-material-select
$ git clone [email protected]:napolev/angular-material-select.git .
$ npm install
$ ng serve

How do I make this demo project work?

Answer 1

1. Extract AppModule from main.ts into it's own file app.module.ts
2. Extract DemoMaterialModule from main.ts into it's own file
3. Add DemoMaterialModule to AppModule's imports list