Angular [проблема с zone.js]


#1



1. package.json

{
  ...
  "dependencies": {
    ...
    "zone.js": "0.6.21"
  }
...
}

#2

Вот файл main.ts:
Вот код, который в этих условиях работает:

import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
import { NgModule }      from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
import { AppComponent }  from './app.component';

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

platformBrowserDynamic().bootstrapModule(AppModule);

Вот код, который в этих условиях не работает:

import { NgModule } from "@angular/core";
import { routing } from "./app.routing";
import { HomeComponent } from "./home-component";
import { ProductDetailComponent } from "./product-detail-component";
import { LocationStrategy, HashLocationStrategy } from "@angular/common";
import { AppComponent } from "./app.component";
import { BrowserModule } from "@angular/platform-browser";
import { platformBrowserDynamic } from "@angular/platform-browser-dynamic";

@NgModule({
  imports: [BrowserModule, routing],
  declarations: [AppComponent, HomeComponent, ProductDetailComponent],
  providers: [{ provide: LocationStrategy, useClass: HashLocationStrategy }],
  bootstrap: [AppComponent]
})
class AppModule {}
platformBrowserDynamic().bootstrapModule(AppModule);

Маршруты:

import { HomeComponent } from "./home-component";
import { ProductDetailComponent } from "./product-detail-component";
import { RouterModule, Routes } from "@angular/router";

const routes: Routes = [
  { path: "", component: HomeComponent },
  { path: "product", component: ProductDetailComponent }
];
export const routing = RouterModule.forRoot(routes);

В чем ошибка?


#3

Информации недостаточно чтобы ответить на вопрос. Если есть возможность, запакуй проект в zip и кинь ссылку на скачивание.

Ангуляр какой версии?

Гугление показывает что некоторые ошибки zone.js сложно понять, но есть возможность улучшить информативность стектрейса если импортировать этот модуль, который идет вкупе с zone.js https://github.com/angular/zone.js/blob/master/dist/zone-error.js вот так https://github.com/shihadsalam/angular5-springboot-frontend/blob/d88f3ef58c5aa51d5c65ba2ebf154462349acf74/src/environments/environment.ts#L4. Может это подтолкнет тебя к идее в чем проблема.


#4

Это пример из книги по Angular 2. В книге весь проект не дан, а только в листингах есть файлы модуля, компонентов. Там даже если скачать код (набранный автором) примеров книги, то этот проект не запускается.


#5

Если запустить код автора, выдает те же ошибки


#6

Кажется это гиблое дело попытаться запустить код который ты кинул личке.

в файле trouble/node_modules/zone.js/dist/zone.js есть строка var fetchPromise = global['fetch'](); которая не работает ибо функция fetch ожидает 1 аргумент. Можешь попробовать запатчить (вообще так не делают, но только ради того чтобы запустился пример - можно разок) этот файл фручную заменив строку на var fetchPromise = global['fetch']('/');.

Но дальше проект все равно не запускается. Теперь проблема в тайпскрипте. И исправили ее только в версии 3. https://github.com/denoland/deno/issues/117

Но и тайпскрипт тоже можно запатчить вручную в trouble/node_modules/typescript/lib/typescript.js заменив

function base64encode(host, input) {
    if (host.base64encode) {
        return host.base64encode(input);
    }
    return convertToBase64(input);
}

на

function base64encode(host, input) {
    if (host && host.base64encode) {
        return host.base64encode(input);
    }
    return convertToBase64(input);
}

Но даже и проект не запускается уже с другими ошибками:

В общем. Забей на книгу и примеры. Ты, как я понимаю, хочешь учить ангуляр? Учи ангуляр последней версии. Все равно разница между последней и версией 2 должна быть существенной. Ангулярщики призываются чтобы подтвердить/опровергнуть этот тезис.


#7

есть книга по 6-му. Прийдется штудировать инглиш


#8

Лучше так чем нерабочие примеры. Все равно вся актуальная информация на английском, документация на английском да и коммьюнити больше по размеру на английском.


#9

Я бы рекомендовал начать с официального сайта. У них есть довольно неплохое интро, называется “Tour of Heroes”. Конечно же на инглише, но без него в нашем ремесле никуда.