Как использовать Angular 8 с Webpack в приложении Rails 6? - PullRequest
0 голосов
/ 24 сентября 2019

Я читаю электронную книгу Rails, Angular, Postgres и Bootstrap, второе издание .Я действительно многому учусь.Книги с 2017 года, но я пытаюсь создать проект со всеми обновленными фреймворками.Я хочу трудный путь.хехехе

Поэтому я использую Rails 6 и Angular 8. Я застрял, когда пытался создать компонент для angular внутри веб-пакета.Как?

Я опишу только те шаги, которые, на мой взгляд, необходимы, вот что я сделал:

Я создаю проект rails с:

rails new angular-on-rails

ЗатемЯ добавил угловой с веб-пакером:

rails webpacker:install:angular

После этого я создал простое представление:

rails g controller dashboard index

И затем, внутри этого представления, я добавил этот код:

<hello-angular></hello-angular>
<%= javascript_pack_tag "hello_angular" %>

Работает!Я вижу Hello Angular в браузере.

После этого я попытался создать компонент с именем hello-component:

import { Component, OnInit } from '@angular/core';

@Component({
  selector: 'hello-component',
  template: `<h1>Hello component</h1>`
})
export class HelloComponent implements OnInit {

  constructor() { }

  ngOnInit() {
  }

}

console.log("Hello Component")

Не забывая обновить app.module.ts:

import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';

import { AppComponent } from './app.component';
import { HelloComponent } from './hello-component/hello-component.component'

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

И index.html.erb:

<hello-angular></hello-angular>
<hello-component></hello-component>
<%= javascript_pack_tag "hello_angular" %>

Я не вижу в браузере компонент Hello и нет ошибок на консоли браузера, он показывает толькоconsole.log из файла hello-component ts.Итак, файл загружается, но не отображается ... Что мне не хватает?

Я поместил этот простой проект в репозиторий , если вы хотите посмотреть.

Спасибо за потраченное время!

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...