Try Bazel’s opt-in preview in Angular CLI
In Google we build all our software with a tool called Bazel. We’ve been using it for the past over 12 years to build projects with any size — from small internal apps, to large applications such as Gmail, Google Drive, and Google Cloud Console.
Thanks to its properties — hermeticity, parallelism, and incrementality, Bazel enables fast builds, which are proportional to the changes that we’ve made, rebuilding only the artifacts that are affected by the updated files.
For the past 2 years, we’ve been working on enabling Angular developers outside of Google to use the same workflow and make their builds faster. In Angular CLI version 8, we’re happy to introduce an opt-in Bazel preview which will allow you to use Bazel transparently, using the same Angular CLI commands you’re used to! Below you can find the official announcement of the opt-in preview from ng-conf by Alex Eagle:
The Bazel Opt-In Preview Is Here
Over the past few months, we introduced the CLI builders, which allow us to change the implementation of some of the built-in Angular CLI commands and create new ones. With
@angular/bazel, we created new implementations of the
ng serve, and
ng test commands which internally invoke Bazel. This way, we can use the command-line interface we’re already familiar without having to know anything about the build tool the CLI uses under the hood!
Today we support standard Angular CLI projects, route-based code-splitting, Sass, third-party dependencies, and more! Here are some of the capabilities that you can expect if you try the opt-in preview:
BUILD.bazelfiles for small projects. Developers using Bazel describe their build process in
BUILD.bazelfiles (you can think of these files as
webpack.config.js), where each
BUILD.bazelfile defines a package and each package defines a separate compilation unit. For small projects, we automatically generate the build configuration and do not expose it to the developers using the Angular CLI
In 2019, we’ll focus on improving the feature set that the Bazel functionality in the CLI provides. Some of the limitations of the opt-in preview that we’re working on are:
Some of the attractive features that Bazel enables are:
All these features you can try today by manually managing your build configuration.
Before trying the opt-in preview of Bazel, make sure you’re using Angular CLI version 8 or above.
To try the Bazel integration with the Angular CLI with a new project, you can provide a custom schematics collection:
npm install -g @angular/bazel ng new my-app [email protected]/bazel
Once you create the new project with the Bazel schematics you and run
ng serve or
ng build the same way you’re used to! There are a few differences:
ng buildproduces a production build by default, so no need to specify the
Keep in mind that the first production build may take a little longer than expected, until Bazel populates its cache. Bazel will also perform some additional operations related to an ongoing effort for better interoperability with npm that we’re going to introduce soon.
We’re focused on providing the capabilities of the Angular CLI that you know today, but with faster, incremental builds using Bazel. We’re working to expand the supported feature set until we reach parity with the current functionality of the CLI. Until then, if you face issues with any of the supported features, open an issue on GitHub
Install Angular in easy step by step process. Firstly Install Node.js & npm, then Install Angular CLI, Create workspace and Deploy your App.
What is Angular? What it does? How we implement it in a project? So, here are some basics of angular to let you learn more about angular. Angular is a Typesc
How to set up the Angular CLI and generate a Trivial App
Sass in Angular is an extension of CSS that allows you to use things like variables, nested rules, inline imports. Angular supports Sass, CSS, and Less.