Angular 2-Angular cli --Build 项目

Question

I am newbie to Angular 2 .我是 Angular 2 的新手。 I developed one small project and packaging is generated using angular-cli .It generates dist folder successfully.我开发了一个小项目，并使用angular-cli生成打包。它成功生成了 dist 文件夹。

But when I deploy this app to server and hit index.html page ,Page cant access the bundle js file.但是当我将此应用程序部署到服务器并点击 index.html 页面时，页面无法访问捆绑 js 文件。

Index.html after bundling::打包后的Index.html::

<head>
  <meta charset="utf-8">
  <title>MyApp</title>
  <base href="/">

  <meta name="viewport" content="width=device-width, initial-scale=1">
  <link rel="icon" type="image/x-icon" href="favicon.ico">
  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
    <link href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet"/>


  <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
  <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
 <!-- Latest compiled and minified JavaScript -->
<script src="//rawgit.com/wenzhixin/bootstrap-table/master/src/bootstrap-table.js"></script>

<link href="styles.d41d8cd98f00b204e9800998ecf8427e.bundle.css" rel="stylesheet"></head>
<body>
  <app-root>Loading...</app-root>
<script type="text/javascript" src="inline.d41d8cd98f00b204e980.bundle.js"></script><script type="text/javascript" src="styles.b2328beb0372c051d06d.bundle.js"></script><script type="text/javascript" src="main.83a76acd0c370402d4d0.bundle.js"></script></body>

Angular-cli.js Angular-cli.js

{
      "project": {
        "version": "1.0.0-beta.21",
        "name": "app-name"
      },
      "apps": [
        {
          "root": "src",
          "outDir": "dist",
          "assets": [
            "assets",
            "favicon.ico"
          ],
          "index": "index.html",
          "main": "main.ts",
          "test": "test.ts",
          "tsconfig": "tsconfig.json",
          "prefix": "app",
          "mobile": false,
          "styles": [
            "styles.css"
          ],
          "scripts": [],
          "environments": {
            "source": "environments/environment.ts",
            "dev": "environments/environment.ts",
            "prod": "environments/environment.prod.ts"
          }
        }
      ],
      "addons": [],
      "packages": [],
      "e2e": {
        "protractor": {
          "config": "./protractor.conf.js"
        }
      },
      "test": {
        "karma": {
          "config": "./karma.conf.js"
        }
      },
      "defaults": {
        "styleExt": "css",
        "prefixInterfaces": false,
        "inline": {
          "style": false,
          "template": false
        },
        "spec": {
          "class": false,
          "component": true,
          "directive": true,
          "module": false,
          "pipe": true,
          "service": true
        }
      }
    }

Folder structure after bundle:捆绑后的文件夹结构：

So my question how can I append folder name in src tag of index.html file while packaging using Angular-CLI like below tag.所以我的问题是如何在使用 Angular-CLI 打包时在 index.html 文件的 src 标签中附加文件夹名称，如下面的标签。

<script type="text/javascript" src="/dist/inline.d41d8cd98f00b204e980.bundle.js">

Answer 1

Have you tried adding你有没有试过添加

<base href="./dist/">

to the head of your html file?到你的 html 文件的头部？

Angular 2-Angular cli --Build 项目

问题描述

1 个解决方案

解决方案1
1 2017-01-25 11:13:26

Angular 2-Angular cli --Build 项目

问题描述

1 个解决方案

解决方案1 1 2017-01-25 11:13:26

解决方案1
1 2017-01-25 11:13:26