在Github上的角4應用頁面

我有一個簡單的Angular (4)應用程序，我想在Github Pages上託管，從Angular CLI這樣做的選項似乎已被刪除。有沒有辦法做到這一點，如果是這樣的話？在Github上的角4應用頁面

這是我的package.json

{ 
    "name": "e-portfolio", 
    "version": "0.0.0", 
    "license": "MIT", 
    "scripts": { 
    "ng": "ng", 
    "start": "ng serve", 
    "build": "ng build", 
    "test": "ng test", 
    "lint": "ng lint", 
    "e2e": "ng e2e" 
    }, 
    "private": true, 
    "dependencies": { 
    "@angular/cli": "^1.0.6", 
    "@angular/common": "^4.0.0", 
    "@angular/compiler": "^4.0.0", 
    "@angular/core": "^4.0.0", 
    "@angular/forms": "^4.0.0", 
    "@angular/http": "^4.0.0", 
    "@angular/platform-browser": "^4.0.0", 
    "@angular/platform-browser-dynamic": "^4.0.0", 
    "@angular/router": "^4.0.0", 
    "@ng-bootstrap/ng-bootstrap": "^1.0.0-alpha.26", 
    "@ngx-translate/core": "^6.0.1", 
    "bootstrap": "^4.0.0-alpha.6", 
    "core-js": "^2.4.1", 
    "font-awesome": "^4.7.0", 
    "rxjs": "^5.1.0", 
    "zone.js": "^0.8.4" 
    }, 
    "devDependencies": { 
    "@angular/cli": "1.0.6", 
    "@angular/compiler-cli": "^4.0.0", 
    "@types/jasmine": "2.5.38", 
    "@types/node": "~6.0.60", 
    "codelyzer": "~2.0.0", 
    "jasmine-core": "~2.5.2", 
    "jasmine-spec-reporter": "~3.2.0", 
    "karma": "~1.4.1", 
    "karma-chrome-launcher": "~2.1.1", 
    "karma-cli": "~1.0.1", 
    "karma-jasmine": "~1.1.0", 
    "karma-jasmine-html-reporter": "^0.2.2", 
    "karma-coverage-istanbul-reporter": "^0.2.0", 
    "protractor": "~5.1.0", 
    "ts-node": "~2.0.0", 
    "tslint": "~4.5.0", 
    "typescript": "~2.2.0" 
    } 
}

當嘗試使用NG構建我得到這個消息

作爲一個預警，我們正朝着在CLI NPM包「@角/ CLI」與下一個版本僅支持6.9或更高版本。不久之後，該軟件包將正式棄用。

要禁用此警告，請使用「ng set --global warnings.packageDeprecation = false」。

您必須在angular-cli項目中才能使用build命令。

我DEBUGLOG

0 info it worked if it ends with ok 
1 verbose cli [ 'C:\\Program Files\\nodejs\\node.exe', 
1 verbose cli 'C:\\Program Files\\nodejs\\node_modules\\npm\\bin\\npm-cli.js', 
1 verbose cli 'start' ] 
2 info using [email protected] 
3 info using [email protected] 
4 verbose stack Error: ENOENT: no such file or directory, open 'C:\Users\User\Documents\School\Portfolio\ePortfolio\package.json' 
4 verbose stack  at Error (native) 
5 verbose cwd C:\Users\User\Documents\School\Portfolio\ePortfolio 
6 error Windows_NT 10.0.15063 
7 error argv "C:\\Program Files\\nodejs\\node.exe" "C:\\Program Files\\nodejs\\node_modules\\npm\\bin\\npm-cli.js" "start" 
8 error node v6.9.5 
9 error npm v3.10.10 
10 error path C:\Users\User\Documents\School\Portfolio\ePortfolio\package.json 
11 error code ENOENT 
12 error errno -4058 
13 error syscall open 
14 error enoent ENOENT: no such file or directory, open 'C:\Users\User\Documents\School\Portfolio\ePortfolio\package.json' 
15 error enoent ENOENT: no such file or directory, open 'C:\Users\User\Documents\School\Portfolio\ePortfolio\package.json' 
15 error enoent This is most likely not a problem with npm itself 
15 error enoent and is related to npm not being able to find a file. 
16 verbose exit [ -4058, true ]

來源

2017-06-02 Burst of Ice

當使用這種commad ng build --prod --base-href "https://USERNAME.github.io/REPOSITORY_NAME/"

我交換了我的寶庫，它被稱爲電子檔案袋，我鍵入它作爲電子檔案袋，似乎字母P必須是它的工作資本。

來源

2017-06-03 16:27:27

您可以使用下面的包https://www.npmjs.com/package/angular-cli-ghpages

來源

2017-06-02 17:17:19

我給它一個嘗試 –

這樣做，但我看看是從我的'index.html'加載''，而不是我想要顯示 –

控制檯上是否有任何錯誤？一個好的方法是在dist文件夾中使用http-server來確保它是一個git hub頁面。 –

我發現的最簡單的方法是2個步驟的過程。首先，你需要知道Github Pages不能很好地處理base href，所以禁用pushState和刪除base href就足以讓我走了。

這裏的步驟：

1 - 通過添加參數{useHash: true}從base href刪除反斜槓"/"在index.html

<base href="">

2 - 禁用pushState。就我而言，我有一個app-routing.module.ts我與下面的代碼更新：

@NgModule({ 
    imports: [RouterModule.forRoot(routes, {useHash: true})], // <-- HERE 
    exports: [RouterModule], 
})

然後發佈到Github的頁面和我們在業務

來源

2017-10-17 21:20:54 ghiscoding

在Github上的角4應用頁面

回答

相關問題