But it is still possible to extend the webpack configuration and add additional loaders or configuration options. With Angular 8, access to the base configuration has been disabled. In earlier versions of Angular, it was possible to eject the webpack configuration and modify it directly. But in some cases, it may be necessary to tweak the configuration of webpack when building an Angular application. Usually, webpack is hidden behind the Angular command-line tool. This allows, for example, Angular TypeScript files to use the import statement to import stylesheet files. Webpack module loaders are able to parse different file types. Because it can support a multitude of plugins, it can perform many additional tasks. Webpack is not limited to simply bundling source files. Bundling multiple modules into a single file is the main purpose of webpack. When deploying a JavaScript application for the browser, the modules must then be built into a single source file. On the other hand, it is good software development practice to separate out code into modules contained in separate files. In practice, any JavaScript application loaded into the browser should be contained in a single source file. To understand the importance of this build tool, it helps to understand why it exists.īrowsers have very limited support for JavaScript modules. The Angular build process uses webpack behind the scenes to transpile TypeScript to JavaScript, transform Sass files to CSS, and many other tasks. If you’re a frontend dev in the world today you’ve probably heard of (and possibly even used) webpack.

How to run webpack-devserver https