(配置与打包)

2017-07-21  本文已影响0人  马丁路德东

终究还是要回到原始的版本 —— 马丁路德.东

(一)构建(也就是转译)
解决spa不能舒心的问题在跟模块更改配置providers

@NgModule({
  declarations: [
    AppComponent,
    NavbarComponent,
    FooterComponent,
    SearchComponent,
    CarouselComponent,
    ProductComponent,
    StarsComponent,
    ProductDetailComponent,
    HomeComponent,
    FilterPipe
  ],
  imports: [
    BrowserModule,
    FormsModule,
    HttpModule,
    RouterModule.forRoot(routeConfig),
    ReactiveFormsModule
  ],
  providers: [ProductService,WebSocketService,
    {provide: LocationStrategy,useClass:HashLocationStrategy}],
  bootstrap: [AppComponent]
})

然后你npm上

ng build

(二)部署
在服务器上新建clicent文件夹
将打包好的文件放进去就行了
然后更改服务器路由配置

import * as path from 'path';
app.use('/', express.static(path.join(__dirname, '..', 'clicent')));

没那么简单,如果想要在本地预览,

一个是改变index.html。的(这是我编辑器的路径)

 <base href="http://localhost:63342/aution1/dist/">

还要把所有的http请求改为绝对路径
放服务器的时候把base删了。

(三)多环境
1.在angular-cli中引入不同的配置而已。
在文件的根目录,有一个angular-cli的配置文件
其中

 "environments": {
        "source": "environments/environment.ts",
        "dev": "environments/environment.ts",
        "prod": "environments/environment.prod.ts"
      }

这是他的多环境配置文件。其中第一个source是通用配置,加新的环境就是在对象里面再加一个对象和相对应的文件就行。(保证每一个文件里都有相同的配置参数)

export const environment = {
  production: false
};

2.在代码中引用环境变量比如main.ts中是否调用生产模式

if (environment.production) {
  enableProdMode();
}

3.我们可以再package.json中的更改属性 start
为prod(看自己用哪个环境)

 "start": "ng serve --env=prod --proxy-config proxy.conf.json",

我们在控制器里面直接用environment.什么什么的就能去到自己的环境变量了。

注意在打包的时候,也要加上自己的配置参数

ng build --env=prod
上一篇 下一篇

猜你喜欢

热点阅读