Angular 4 root module 'import' and 'imports'

A typical root module in angular 4 looks like this

import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { FormsModule } from '@angular/forms';
import { HttpModule } from '@angular/http';

import { AppComponent } from './app.component';

@NgModule({
  declarations: [
    AppComponent
  ],
  imports: [
    BrowserModule,
    FormsModule,
    HttpModule
  ],
  providers: [],
  bootstrap: [AppComponent]
})
export class AppModule { }

In the documentation, it is mentioned "In the example of the simple root module above, the application module needs material from within that browser module. To access that material, add it to the @NgModule metadata imports like this." imports: [ BrowserModule ],

My questions are:

What does "the application module needs material from within that browser module" mean?

What is the difference between this import import { BrowserModule } from '@angular/platform-browser'; and this one imports: [ BrowserModule ], ?

Could someone please help me understand the purpose of using imports in the root module?