2016-10-31 18 views
1

これは私の最初の投稿です。Rails 5 + Angular 2アプリをHerokuに配備 - 「成功」を構築するが、デプロイメントエラー

clientフォルダにAngular 2を埋め込んだRails-APIアプリをデプロイしようとしています。そのため、アプリ全体を一度に展開できます。ただし、git push heroku masterで展開すると、アプリケーションのデプロイメントに失敗しても、ビルドは「成功」します。

まず私は、パブリックフォルダへの私の角度クライアントアプリケーションをリンク:

$ rm -rf public 
$ ln -s client/dist public 

は、それから私は、次のbuildpacksを追加しました:ここ

$ heroku buildpacks:add https://github.com/jasonswett/heroku-buildpack-nodejs 
$ heroku buildpacks:add heroku/ruby 

は私のpackage.jsonです:

{ 
    "name": "my_app", 
    "version": "0.0.0", 
    "license": "MIT", 
    "angular-cli": {}, 
    "scripts": { 
    "lint": "tslint \"src/**/*.ts\"", 
    "test": "ng test", 
    "pree2e": "webdriver-manager update", 
    "e2e": "protractor", 
    "preinstall": "npm install -g node-gyp", 
    "heroku-postbuild": "ng build" 
    }, 
    "private": true, 
    "dependencies": { 
    "@angular/common": "2.0.0-rc.5", 
    "@angular/compiler": "2.0.0-rc.5", 
    "@angular/core": "2.0.0-rc.5", 
    "@angular/forms": "0.3.0", 
    "@angular/http": "2.0.0-rc.5", 
    "@angular/platform-browser": "2.0.0-rc.5", 
    "@angular/platform-browser-dynamic": "2.0.0-rc.5", 
    "@angular/router": "3.0.0-rc.1", 
    "core-js": "^2.4.0", 
    "rxjs": "5.0.0-beta.11", 
    "ts-helpers": "^1.1.1", 
    "zone.js": "0.6.12", 
    "@types/jasmine": "^2.2.30", 
    "angular-cli": "1.0.0-beta.11-webpack.8", 
    "codelyzer": "~0.0.26", 
    "jasmine-core": "2.4.1", 
    "jasmine-spec-reporter": "2.5.0", 
    "karma": "0.13.22", 
    "karma-chrome-launcher": "0.2.3", 
    "karma-jasmine": "0.3.8", 
    "karma-remap-istanbul": "^0.2.1", 
    "protractor": "4.0.3", 
    "ts-node": "1.2.1", 
    "tslint": "3.13.0", 
    "typescript": "2.0.0", 
    "awesome-typescript-loader": "2.2.1" 
    }, 
    "devDependencies": { 
    } 
} 

thisからのアドバイスに続き、"awesome-typescript-loader": "2.2.1"をthに追加するe package.json依存関係もエラーを解決しませんでした。 How to Deploy a Rails Application with an Angular CLI Webpack Front-End

ログの関連部分git push heroku master後:

{...} 
re34ms emitting 
remote:  Hash: 8b0f868d8f0eb54b494b 
remote:  Version: webpack 2.1.0-beta.21 
remote:  Time: 10807ms 
remote:  Asset  Size Chunks    Chunk Names 
remote:  main.bundle.js 2.51 MB 0, 2 [emitted] main 
remote:  styles.bundle.js 10.2 kB 1, 2 [emitted] styles 
remote:  inline.js 5.53 kB  2 [emitted] inline 
remote:  main.map 3.12 MB 0, 2 [emitted] main 
remote:  styles.map 14.2 kB 1, 2 [emitted] styles 
remote:  inline.map 5.59 kB  2 [emitted] inline 
remote:  index.html 472 bytes   [emitted] 
remote:  chunk {0} main.bundle.js, main.map (main) 2.46 MB {1} [initial] [rendered] 
remote:  chunk {1} styles.bundle.js, styles.map (styles) 9.96 kB {2} [initial] [rendered] 
remote:  chunk {2} inline.js, inline.map (inline) 0 bytes [entry] [rendered] 
remote: 
remote:  ERROR in [default] /tmp/build_26074be1021be2d930cc2ecb8ff54a9a/client/src/app/app.component.ts:5:12 
remote:  Cannot find name 'require'. 
remote: 
remote:  ERROR in [default] /tmp/build_26074be1021be2d930cc2ecb8ff54a9a/client/src/app/app.component.ts:6:11 
remote:  Cannot find name 'require'. 
remote:  Child html-webpack-plugin for "index.html": 
remote:  Asset  Size Chunks  Chunk Names 
remote:  index.html 2.81 kB  0 
remote:  chunk {0} index.html 339 bytes [entry] [rendered] 
{...} 

に関連する可能性があるその他の情報がある

FYI、私はジェイソン・スウェットによってトピックに関する本ガイド以下となっています知っている、この問題をデバッグするには?

+0

typescriptが知るために必要な定義が必要です。https://github.com/TypeStrong/ts-loader#loading-other-resources-and-code-splitting – 12seconds

答えて

0
"scripts": { 
"start": "ng serve --proxy-config proxy.conf.json", 
"lint": "tslint \"src/**/*.ts\"", 
"test": "ng test", 
"pree2e": "webdriver-manager update", 
"e2e": "protractor", 
"heroku-postbuild": "ng build --prod" 
}, 

"スタート"

を追加します、 "NGは--proxy-設定proxy.conf.jsonを果たす"

とHerokuのにプッシュする前に変更をコミットすることを忘れないでください:)

+0

「scripts」:{ "start" : "ng serve --proxy-config proxy.conf.json"、 "lint": "tslint \" src/"/ /。ts \" "、 " test ":" ng test "、 " pree2e ":" webdriver-manager update "、 " e2e ":"分度器 "、 " heroku-postbuild ":" ngビルド--prod " }、 –

関連する問題