从base href

时间:2016-03-12 02:51:02

标签: angular asp.net-core systemjs

我正在使用dotnet核心在不同的子目录中提供独立的角度应用程序。看到这件事在行动中是一个爆炸,但我遇到了一些我不明白的事情。

我的应用程序住在这里:

wwwroot/
  pap/
    admin/
      boot.ts
      admin.component.ts

此应用的MVC路线是/ pap / admin /。在这种情况下,有两种方法可以让Angular2路由工作。第一个是构建我的所有Angular路由以匹配MVC路由。这有效,但感觉很便宜。第二种方法是像这样设置基本标签:

<base href="/pap/admin/">

这两种方式都允许我独立使用服务器端和客户端路由,而无需使用/ panel / admin /预先添加每个路由。如,

@RouteConfig([
  { path: '/menu', name: 'Menu', component: MenuComponent, useAsDefault: true }, 
  { path: '/panels/:id', name: 'Panel', component: PanelComponent } 
  ])

我的问题在于SystemJS。我已经进行了实验,阅读,搜索,但我仍然不知道发生了什么。在快速入门中,Angular库包含在脚本标记中。如果我理解正确,则无需告知应用程序Angular和Rxjs的加载位置,因为它们已包含在文档中。

这些库位于node_modules中,并且就像它们存在于wwwroot /中一样。随着,我的应用程序开始在/ pap / admin / angular2 /中寻找文件而不是它们的位置。如果我使用此配置,

System.config({
  baseURL: '/',
  defaultJSExtensions: true,
  packages: {
    format: 'register',
    'pap/admin': { defaultExtension: 'js' }
  }
});
System.import('/pap/admin/admin.boot.js')
  .then(null, console.error.bind(console));

然后整个事情就会爆炸,寻找我曾经导入的所有东西,从

开始
import {bootstrap} from 'angular2/platform/browser';

它正在根(wwwroot或http://localhost:5000/angular2/platform/browser.js)而不是/ node_modules / angular2 /中查找它。这对我来说很有意义,虽然我不完全理解为什么它不使用我在脚本标签中加载的库。

如果我使用

System.config({
  baseURL: '/node_modules/',
  defaultJSExtensions: true,
  packages: { 
    format: 'register',
    'pap/admin': { defaultExtension: 'js' }
  },
});
System.import('/pap/admin/admin.boot.js')
  .then(null, console.error.bind(console));
该应用程序栩栩如生。即使我从脚本标记中删除了库,它也会这样做。当然,SystemJS现在知道如果我从'angular2 / core'导入一些东西,它可以在/ node_modules /中找到它。这里的缺点是初始性能明显较慢。检查dotnet核心的输出,我可以看到它正在加载这些库中的每个文件。 Woops。

我想如果我使用了baseURL:'/'并将Angular位映射到他们居住的地方,一切都会好的,

map: { angular2: '/node_modules/angular2/' }

但结果是一样的;每一件作品都装满了。

还有一件事...... SystemJS说他们很快就会摆脱defaultJSExtensions,但是一旦我添加并开始争论System.config部分,如果没有它,事情就行不通。

我很感激任何有过SystemJS经验或建立在新的dotnet核心之上的人的指导。

修改1

我尝试开始使用jspm,但正如我在下面评论的那样,要么我正在做一些疯狂的事情,要么就是这样。这是我的config.js后只运行jspm install angular2:

   System.config({
  defaultJSExtensions: true,
  transpiler: "typescript",
  typescriptOptions: {
    "module": "commonjs",
    "emitDecoratorMetadata": true
  },
  paths: {
    "github:*": "jspm_packages/github/*",
    "npm:*": "jspm_packages/npm/*"
  },

  map: {
    "angular2": "npm:angular2@2.0.0-beta.9",
    "core-js": "npm:core-js@1.2.6",
    "typescript": "npm:typescript@1.8.7",
    "github:jspm/nodelibs-assert@0.1.0": {
      "assert": "npm:assert@1.3.0"
    },
    "github:jspm/nodelibs-buffer@0.1.0": {
      "buffer": "npm:buffer@3.6.0"
    },
    "github:jspm/nodelibs-constants@0.1.0": {
      "constants-browserify": "npm:constants-browserify@0.0.1"
    },
    "github:jspm/nodelibs-crypto@0.1.0": {
      "crypto-browserify": "npm:crypto-browserify@3.11.0"
    },
    "github:jspm/nodelibs-events@0.1.1": {
      "events": "npm:events@1.0.2"
    },
    "github:jspm/nodelibs-path@0.1.0": {
      "path-browserify": "npm:path-browserify@0.0.0"
    },
    "github:jspm/nodelibs-process@0.1.2": {
      "process": "npm:process@0.11.2"
    },
    "github:jspm/nodelibs-stream@0.1.0": {
      "stream-browserify": "npm:stream-browserify@1.0.0"
    },
    "github:jspm/nodelibs-string_decoder@0.1.0": {
      "string_decoder": "npm:string_decoder@0.10.31"
    },
    "github:jspm/nodelibs-util@0.1.0": {
      "util": "npm:util@0.10.3"
    },
    "github:jspm/nodelibs-vm@0.1.0": {
      "vm-browserify": "npm:vm-browserify@0.0.4"
    },
    "npm:angular2@2.0.0-beta.9": {
      "crypto": "github:jspm/nodelibs-crypto@0.1.0",
      "es6-promise": "npm:es6-promise@3.1.2",
      "es6-shim": "npm:es6-shim@0.33.13",
      "process": "github:jspm/nodelibs-process@0.1.2",
      "reflect-metadata": "npm:reflect-metadata@0.1.2",
      "rxjs": "npm:rxjs@5.0.0-beta.2",
      "zone.js": "npm:zone.js@0.5.15"
    },
    "npm:asn1.js@4.5.2": {
      "assert": "github:jspm/nodelibs-assert@0.1.0",
      "bn.js": "npm:bn.js@4.11.0",
      "buffer": "github:jspm/nodelibs-buffer@0.1.0",
      "fs": "github:jspm/nodelibs-fs@0.1.2",
      "inherits": "npm:inherits@2.0.1",
      "minimalistic-assert": "npm:minimalistic-assert@1.0.0",
      "vm": "github:jspm/nodelibs-vm@0.1.0"
    },
    "npm:assert@1.3.0": {
      "util": "npm:util@0.10.3"
    },
    "npm:bn.js@4.11.0": {
      "buffer": "github:jspm/nodelibs-buffer@0.1.0"
    },
    "npm:browserify-aes@1.0.6": {
      "buffer": "github:jspm/nodelibs-buffer@0.1.0",
      "buffer-xor": "npm:buffer-xor@1.0.3",
      "cipher-base": "npm:cipher-base@1.0.2",
      "create-hash": "npm:create-hash@1.1.2",
      "crypto": "github:jspm/nodelibs-crypto@0.1.0",
      "evp_bytestokey": "npm:evp_bytestokey@1.0.0",
      "fs": "github:jspm/nodelibs-fs@0.1.2",
      "inherits": "npm:inherits@2.0.1",
      "systemjs-json": "github:systemjs/plugin-json@0.1.0"
    },
    "npm:browserify-cipher@1.0.0": {
      "browserify-aes": "npm:browserify-aes@1.0.6",
      "browserify-des": "npm:browserify-des@1.0.0",
      "buffer": "github:jspm/nodelibs-buffer@0.1.0",
      "crypto": "github:jspm/nodelibs-crypto@0.1.0",
      "evp_bytestokey": "npm:evp_bytestokey@1.0.0"
    },
    "npm:browserify-des@1.0.0": {
      "buffer": "github:jspm/nodelibs-buffer@0.1.0",
      "cipher-base": "npm:cipher-base@1.0.2",
      "crypto": "github:jspm/nodelibs-crypto@0.1.0",
      "des.js": "npm:des.js@1.0.0",
      "inherits": "npm:inherits@2.0.1"
    },
    "npm:browserify-rsa@4.0.1": {
      "bn.js": "npm:bn.js@4.11.0",
      "buffer": "github:jspm/nodelibs-buffer@0.1.0",
      "constants": "github:jspm/nodelibs-constants@0.1.0",
      "crypto": "github:jspm/nodelibs-crypto@0.1.0",
      "randombytes": "npm:randombytes@2.0.3"
    },
    "npm:browserify-sign@4.0.0": {
      "bn.js": "npm:bn.js@4.11.0",
      "browserify-rsa": "npm:browserify-rsa@4.0.1",
      "buffer": "github:jspm/nodelibs-buffer@0.1.0",
      "create-hash": "npm:create-hash@1.1.2",
      "create-hmac": "npm:create-hmac@1.1.4",
      "crypto": "github:jspm/nodelibs-crypto@0.1.0",
      "elliptic": "npm:elliptic@6.2.3",
      "inherits": "npm:inherits@2.0.1",
      "parse-asn1": "npm:parse-asn1@5.0.0",
      "stream": "github:jspm/nodelibs-stream@0.1.0"
    },
    "npm:buffer-xor@1.0.3": {
      "buffer": "github:jspm/nodelibs-buffer@0.1.0",
      "systemjs-json": "github:systemjs/plugin-json@0.1.0"
    },
    "npm:buffer@3.6.0": {
      "base64-js": "npm:base64-js@0.0.8",
      "child_process": "github:jspm/nodelibs-child_process@0.1.0",
      "fs": "github:jspm/nodelibs-fs@0.1.2",
      "ieee754": "npm:ieee754@1.1.6",
      "isarray": "npm:isarray@1.0.0",
      "process": "github:jspm/nodelibs-process@0.1.2"
    },
    "npm:cipher-base@1.0.2": {
      "buffer": "github:jspm/nodelibs-buffer@0.1.0",
      "inherits": "npm:inherits@2.0.1",
      "stream": "github:jspm/nodelibs-stream@0.1.0",
      "string_decoder": "github:jspm/nodelibs-string_decoder@0.1.0"
    },
    "npm:constants-browserify@0.0.1": {
      "systemjs-json": "github:systemjs/plugin-json@0.1.0"
    },
    "npm:core-js@1.2.6": {
      "fs": "github:jspm/nodelibs-fs@0.1.2",
      "path": "github:jspm/nodelibs-path@0.1.0",
      "process": "github:jspm/nodelibs-process@0.1.2",
      "systemjs-json": "github:systemjs/plugin-json@0.1.0"
    },
    "npm:core-util-is@1.0.2": {
      "buffer": "github:jspm/nodelibs-buffer@0.1.0"
    },
    "npm:create-ecdh@4.0.0": {
      "bn.js": "npm:bn.js@4.11.0",
      "buffer": "github:jspm/nodelibs-buffer@0.1.0",
      "crypto": "github:jspm/nodelibs-crypto@0.1.0",
      "elliptic": "npm:elliptic@6.2.3"
    },
    "npm:create-hash@1.1.2": {
      "buffer": "github:jspm/nodelibs-buffer@0.1.0",
      "cipher-base": "npm:cipher-base@1.0.2",
      "crypto": "github:jspm/nodelibs-crypto@0.1.0",
      "fs": "github:jspm/nodelibs-fs@0.1.2",
      "inherits": "npm:inherits@2.0.1",
      "ripemd160": "npm:ripemd160@1.0.1",
      "sha.js": "npm:sha.js@2.4.5"
    },
    "npm:create-hmac@1.1.4": {
      "buffer": "github:jspm/nodelibs-buffer@0.1.0",
      "create-hash": "npm:create-hash@1.1.2",
      "crypto": "github:jspm/nodelibs-crypto@0.1.0",
      "inherits": "npm:inherits@2.0.1",
      "stream": "github:jspm/nodelibs-stream@0.1.0"
    },
    "npm:crypto-browserify@3.11.0": {
      "browserify-cipher": "npm:browserify-cipher@1.0.0",
      "browserify-sign": "npm:browserify-sign@4.0.0",
      "create-ecdh": "npm:create-ecdh@4.0.0",
      "create-hash": "npm:create-hash@1.1.2",
      "create-hmac": "npm:create-hmac@1.1.4",
      "diffie-hellman": "npm:diffie-hellman@5.0.2",
      "inherits": "npm:inherits@2.0.1",
      "pbkdf2": "npm:pbkdf2@3.0.4",
      "public-encrypt": "npm:public-encrypt@4.0.0",
      "randombytes": "npm:randombytes@2.0.3"
    },
    "npm:des.js@1.0.0": {
      "buffer": "github:jspm/nodelibs-buffer@0.1.0",
      "inherits": "npm:inherits@2.0.1",
      "minimalistic-assert": "npm:minimalistic-assert@1.0.0"
    },
    "npm:diffie-hellman@5.0.2": {
      "bn.js": "npm:bn.js@4.11.0",
      "buffer": "github:jspm/nodelibs-buffer@0.1.0",
      "crypto": "github:jspm/nodelibs-crypto@0.1.0",
      "miller-rabin": "npm:miller-rabin@4.0.0",
      "randombytes": "npm:randombytes@2.0.3",
      "systemjs-json": "github:systemjs/plugin-json@0.1.0"
    },
    "npm:elliptic@6.2.3": {
      "bn.js": "npm:bn.js@4.11.0",
      "brorand": "npm:brorand@1.0.5",
      "hash.js": "npm:hash.js@1.0.3",
      "inherits": "npm:inherits@2.0.1",
      "systemjs-json": "github:systemjs/plugin-json@0.1.0"
    },
    "npm:es6-promise@3.1.2": {
      "process": "github:jspm/nodelibs-process@0.1.2"
    },
    "npm:es6-shim@0.33.13": {
      "process": "github:jspm/nodelibs-process@0.1.2"
    },
    "npm:evp_bytestokey@1.0.0": {
      "buffer": "github:jspm/nodelibs-buffer@0.1.0",
      "create-hash": "npm:create-hash@1.1.2",
      "crypto": "github:jspm/nodelibs-crypto@0.1.0"
    },
    "npm:hash.js@1.0.3": {
      "inherits": "npm:inherits@2.0.1"
    },
    "npm:inherits@2.0.1": {
      "util": "github:jspm/nodelibs-util@0.1.0"
    },
    "npm:miller-rabin@4.0.0": {
      "bn.js": "npm:bn.js@4.11.0",
      "brorand": "npm:brorand@1.0.5"
    },
    "npm:parse-asn1@5.0.0": {
      "asn1.js": "npm:asn1.js@4.5.2",
      "browserify-aes": "npm:browserify-aes@1.0.6",
      "buffer": "github:jspm/nodelibs-buffer@0.1.0",
      "create-hash": "npm:create-hash@1.1.2",
      "evp_bytestokey": "npm:evp_bytestokey@1.0.0",
      "pbkdf2": "npm:pbkdf2@3.0.4",
      "systemjs-json": "github:systemjs/plugin-json@0.1.0"
    },
    "npm:path-browserify@0.0.0": {
      "process": "github:jspm/nodelibs-process@0.1.2"
    },
    "npm:pbkdf2@3.0.4": {
      "buffer": "github:jspm/nodelibs-buffer@0.1.0",
      "child_process": "github:jspm/nodelibs-child_process@0.1.0",
      "create-hmac": "npm:create-hmac@1.1.4",
      "crypto": "github:jspm/nodelibs-crypto@0.1.0",
      "path": "github:jspm/nodelibs-path@0.1.0",
      "process": "github:jspm/nodelibs-process@0.1.2",
      "systemjs-json": "github:systemjs/plugin-json@0.1.0"
    },
    "npm:process@0.11.2": {
      "assert": "github:jspm/nodelibs-assert@0.1.0"
    },
    "npm:public-encrypt@4.0.0": {
      "bn.js": "npm:bn.js@4.11.0",
      "browserify-rsa": "npm:browserify-rsa@4.0.1",
      "buffer": "github:jspm/nodelibs-buffer@0.1.0",
      "create-hash": "npm:create-hash@1.1.2",
      "crypto": "github:jspm/nodelibs-crypto@0.1.0",
      "parse-asn1": "npm:parse-asn1@5.0.0",
      "randombytes": "npm:randombytes@2.0.3"
    },
    "npm:randombytes@2.0.3": {
      "buffer": "github:jspm/nodelibs-buffer@0.1.0",
      "crypto": "github:jspm/nodelibs-crypto@0.1.0",
      "process": "github:jspm/nodelibs-process@0.1.2"
    },
    "npm:readable-stream@1.1.13": {
      "buffer": "github:jspm/nodelibs-buffer@0.1.0",
      "core-util-is": "npm:core-util-is@1.0.2",
      "events": "github:jspm/nodelibs-events@0.1.1",
      "inherits": "npm:inherits@2.0.1",
      "isarray": "npm:isarray@0.0.1",
      "process": "github:jspm/nodelibs-process@0.1.2",
      "stream-browserify": "npm:stream-browserify@1.0.0",
      "string_decoder": "npm:string_decoder@0.10.31"
    },
    "npm:reflect-metadata@0.1.2": {
      "assert": "github:jspm/nodelibs-assert@0.1.0",
      "process": "github:jspm/nodelibs-process@0.1.2"
    },
    "npm:ripemd160@1.0.1": {
      "buffer": "github:jspm/nodelibs-buffer@0.1.0",
      "process": "github:jspm/nodelibs-process@0.1.2"
    },
    "npm:rxjs@5.0.0-beta.2": {
      "buffer": "github:jspm/nodelibs-buffer@0.1.0",
      "process": "github:jspm/nodelibs-process@0.1.2"
    },
    "npm:sha.js@2.4.5": {
      "buffer": "github:jspm/nodelibs-buffer@0.1.0",
      "fs": "github:jspm/nodelibs-fs@0.1.2",
      "inherits": "npm:inherits@2.0.1",
      "process": "github:jspm/nodelibs-process@0.1.2"
    },
    "npm:stream-browserify@1.0.0": {
      "events": "github:jspm/nodelibs-events@0.1.1",
      "inherits": "npm:inherits@2.0.1",
      "readable-stream": "npm:readable-stream@1.1.13"
    },
    "npm:string_decoder@0.10.31": {
      "buffer": "github:jspm/nodelibs-buffer@0.1.0"
    },
    "npm:util@0.10.3": {
      "inherits": "npm:inherits@2.0.1",
      "process": "github:jspm/nodelibs-process@0.1.2"
    },
    "npm:vm-browserify@0.0.4": {
      "indexof": "npm:indexof@0.0.1"
    },
    "npm:zone.js@0.5.15": {
      "es6-promise": "npm:es6-promise@3.1.2",
      "process": "github:jspm/nodelibs-process@0.1.2"
    }
  }
});

修改2

在浏览jspm在我的节点库中映射到的那些列表时,我注意到了这一点:

"npm:angular2@2.0.0-beta.9": {
  "crypto": "github:jspm/nodelibs-crypto@0.1.0",
  "es6-promise": "npm:es6-promise@3.1.2",
  "es6-shim": "npm:es6-shim@0.33.13",
  "process": "github:jspm/nodelibs-process@0.1.2",
  "reflect-metadata": "npm:reflect-metadata@0.1.2",
  "rxjs": "npm:rxjs@5.0.0-beta.2",
  "zone.js": "npm:zone.js@0.5.15"
},

在其他地方,我看到人们分别安装这些库中的每一个,但是现在看起来像安装angular2一样通常依赖于它们。

4 个答案:

答案 0 :(得分:1)

更短的答案

您写道:

  

这些库位于node_modules中。

不要把它们放在那里。把它们放在wwwroot里面。那是客户端库所属的地方。 node_modules目录更适合服务器端库。

更长的答案

您使用的是jspm吗?这可能有所帮助。也许在一次性项目中试验它,了解标准的项目结构。

安装并初始化JSPM

C:\MyProject> npm install jspm --save-dev
C:\MyProject> jspm init

jspm init上,接受大多数默认值(按Enter键。)ASP.NET Core只有一个非默认值。

Enter server baseURL (public folder path) [./]:wwwroot

安装客户端资源

完成jspm init后,安装客户端资源,如下所示:

C:\MyProject> jsmp install angular
C:\MyProject> jspm install bootstrap

这会将它们放入wwwroot > jspm_packages > npm目录,并将它们映射到config.js文件中。

可能的ASP.NET核心项目结构

以下是我们一直使用的结果项目结构(为清楚起见,省略了许多项目。)

MyProject/
    node_modules/            <-- for server-side tooling
    wwwroot/        
       jspm_packages/        <-- for client-side resources
           github/
               angular   
               components
               twbs
           npm/
               typescript@1.8.7/   
               typescript@1.8.7.js/
       config.js          
    package.json
    project.json    
    Startup.cs

可能的config.js文件

这是我们的config.js。我们可以使用baseURL: "/",因为config.js位于我们的wwwroot目录中。

System.config({                                     
  baseURL: "/",                                     
  defaultJSExtensions: true,                        
  transpiler: "typescript",                         
  paths: {                                          
    "npm:*": "jspm_packages/npm/*",                 
    "github:*": "jspm_packages/github/*"            
  },                                                

  map: {                                            
    "angular": "github:angular/bower-angular@1.5.0",
    "bootstrap": "github:twbs/bootstrap@3.3.6",     
    "typescript": "npm:typescript@1.8.7"
  }                                                 
});
祝你好运。 :)

答案 1 :(得分:1)

正如@Shaun Luttin所写:&#34;不要将图书馆放在node_modules&#34;中。

我建议使用gulp任务的解决方案。

将您的角度代码放入src文件夹的子文件夹

node_modules/
src/
  app/
wwwroot/

创建一个包含gulpfile.js任务的.ts来编译您的wwwroot并在var gulp = require("gulp"); var del = require("del"); var tsc = require("gulp-typescript"); var sourcemaps = require('gulp-sourcemaps'); var tsProject = tsc.createProject("tsconfig.json"); var cache = require('gulp-cached'); /** * Watch for source file changed. */ gulp.task('watch', function () { gulp.watch("src/**/*", ['compile', 'resources']); }); /** * Compile TypeScript files into wwwroot directory. */ gulp.task('compile', function () { var tsResult = gulp.src("src/**/*.ts") .pipe(cache('compiling')) .pipe(sourcemaps.init()) .pipe(tsc(tsProject)); return tsResult.js .pipe(sourcemaps.write(".")) .pipe(gulp.dest("wwwroot")); }); /** * Copy all resources that are not TypeScript files into wwwroot directory. */ gulp.task("resources", function () { return gulp.src(["src/**/*", "!**/*.ts"]) .pipe(cache('resourcing')) .pipe(gulp.dest("wwwroot")) }); /** * Copy all required libraries into wwwroot directory. */ gulp.task("libs", function () { return gulp.src([ 'es6-shim/es6-shim.min.js', 'systemjs/dist/system-polyfills.js', 'angular2/bundles/angular2-polyfills.js', 'systemjs/dist/system.src.js', 'rxjs/bundles/Rx.js', 'angular2/bundles/angular2.dev.js', 'angular2/bundles/router.dev.js', 'angular2/es6/dev/src/testing/shims_for_IE.js' ], {cwd: "node_modules/**"}) /* Glob required here. */ .pipe(gulp.dest("wwwroot/lib")); }); /** * Build all. */ gulp.task("build", ['compile', 'resources', 'libs'], function () { console.log("Building the project ...") }); /** * Default task. */ gulp.task('default', ['watch']);

中复制您的来源
gulp-cached

此脚本使用watch编译和复制仅更改的文件。 有一个build任务可以监视更改的文件,因此每次修改代码时都不需要启动npm build任务。 第一次使用angular 2构建整个npm watch应用,然后使用angular 2

node_modules文件夹到wwwroot/lib文件夹的脚本复制index.html依赖项。配置<html> <head> <base href="/"> <title>ma freebox blog</title> <meta name="viewport" content="width=device-width, initial-scale=1"> <link rel="stylesheet" href="styles.css"> <!-- 1. Load libraries --> <!-- IE required polyfills, in this exact order --> <script src="lib/es6-shim/es6-shim.min.js"></script> <script src="lib/systemjs/dist/system-polyfills.js"></script> <script src="lib/angular2/es6/dev/src/testing/shims_for_IE.js"></script> <script src="lib/angular2/bundles/angular2-polyfills.js"></script> <script src="lib/systemjs/dist/system.src.js"></script> <script src="lib/rxjs/bundles/Rx.js"></script> <script src="lib/angular2/bundles/angular2.dev.js"></script> <script src="lib/angular2/bundles/router.dev.js"></script> <!-- 2. Configure SystemJS --> <script> System.config({ packages: { app: { format: 'register', defaultExtension: 'js' } } }); System.import('app/main') .then(null, console.error.bind(console)); </script> </head> <!-- 3. Display the application --> <body> <my-app>Loading ...</my-app> </body> </html> 以使用此文件夹

package.json

gulp依赖项配置{ "name": "your app name", "version": "1.0.0", "scripts": { "start": "concurrently \"npm run gulp\" \"npm run lite\" ", "tsc": "tsc", "tsc:w": "tsc -w", "gulp": "gulp", "build": "gulp build", "watch": "gulp watch", "resources": "gulp resources", "lite": "lite-server", "typings": "typings", "postinstall": "typings install" }, "license": "ISC", "dependencies": { "angular2": "2.0.0-beta.8", "systemjs": "0.19.24", "es6-promise": "^3.1.2", "es6-shim": "^0.33.3", "reflect-metadata": "0.1.2", "rxjs": "5.0.0-beta.2", "zone.js": "0.5.15" }, "devDependencies": { "concurrently": "^2.0.0", "lite-server": "^2.1.0", "typescript": "^1.8.7", "typings":"^0.7.7", "del": "^2.2.0", "gulp": "^3.9.1", "gulp-cached" : "^1.1.0", "gulp-typescript": "^2.12.1", "gulp-sourcemaps": "^1.6.0" } }

lite-server

在此示例中,我在脚本部分使用node_modules/ scr/ app/ wwwroot/ app/ lib/ ,但这不是强制性的。

构建文件夹结构后将

    global tolower_cmov

tolower_cmov:
    enter 0, 0
    mov edx, [ebp + 8]
    xor eax, eax
    xor ecx, ecx
.back:
    test [edx], byte 0xff
    jz .end

    mov eax, [edx]
    mov ecx, [edx]
    add [eax], byte 'a' - 'A'
    cmp [edx], byte 'A'
    cmovb [edx], eax
    cmp [edx], byte 'z'
    cmova [edx],  ecx

    inc edx
    jmp .back
.end:
    leave
    ret

答案 2 :(得分:1)

虽然用gulp包装东西似乎是最好的方法,但是因为你还是想要这样做,我们确实找到了解决这个问题的快速解决方法。

使基本ref指向包含angular项目的子目录。这将确保找到所有node_module依赖项等。然后使用不同的APP_BASE_HREF配置PathLocationStrategy,以便html5模式仍适用于实际的角度应用程序。

bootstrap(AppComponent, [..... bind(APP_BASE_HREF).toValue("/yardmap/planning")

参考:https://angular.io/docs/ts/latest/api/common/index/APP_BASE_HREF-let.html

参考:https://angular.io/docs/ts/latest/guide/router.html

答案 3 :(得分:0)

当您在域中部署到非根路径时,您需要手动更新

<base href="/">

<base href="/wwwroot/">
你的dist / index.html中的

在webpack.common.js中进行更改

  1. 在webpack.common.js
  2. 中更改balseUrl:'/wwwroot/'
  3. /wwwroot/添加到index.html
  4. 中的链接