Fatal编程技术网
  • angular2-routing/
  • Angular2 routing Angular路由器示例升级到包含.Angular-cli.json和bypass的最佳方式无法读取属性'；配置'；空的

Angular2 routing Angular路由器示例升级到包含.Angular-cli.json和bypass的最佳方式无法读取属性'；配置'；空的

Angular2 routing Angular路由器示例升级到包含.Angular-cli.json和bypass的最佳方式无法读取属性'；配置'；空的,angular2-routing,angular-cli,Angular2 Routing,Angular Cli,我试着从这里下载路由和导航示例 这里是到具体问题的链接 我运行以下命令序列： npm安装 npm安装--保存dev@angular/cli@latest ng-v ng发球-o 据我所知，无法读取null的属性“config” 某种程度上与CLI的错误版本有关。但是，如果我创建了一个新项目，我可以用现有的设置成功地启动它 ng新路由器 cd路由器 npm安装 ng发球-o 旧目录结构（从zip下载）包括以下文件： bs-config.json e2e-spec.ts 新目录结构（来自ng N

我试着从这里下载路由和导航示例

这里是到具体问题的链接

我运行以下命令序列：

  • npm安装
  • npm安装--保存dev@angular/cli@latest
  • ng-v
  • ng发球-o
    • 据我所知，无法读取null的属性“config” 某种程度上与CLI的错误版本有关。但是，如果我创建了一个新项目，我可以用现有的设置成功地启动它

  • ng新路由器
  • cd路由器
  • npm安装
  • ng发球-o
    • 旧目录结构（从zip下载）包括以下文件：

    • bs-config.json
    • e2e-spec.ts
    新目录结构（来自ng New）：

    • .angular-cli.json
    • e2e是一个包含文件的文件夹
    • karma.conf.js
    • progrator.conf.js
    • tsconfig.json
    是否有某种ng升级命令来转换项目？
    曾经有过一些讨论，但现在似乎已经成为过去。
    我相信大多数文件都与端到端测试相关

    npm install npm WARN deprecated minimatch@0.3.0: Please update to minimatch 3.0.2 or higher to avoid a RegExp DoS issue npm WARN deprecated node-uuid@1.4.8: Use uuid module instead > phantomjs-prebuilt@2.1.14 install /opt/AngularProjects/router/node_modules/phantomjs-prebuilt > node install.js PhantomJS not found on PATH Download already available at /var/folders/xz/sgpc803n1ms6xpc5n571ytc80000gn/T/phantomjs/phantomjs-2.1.1-macosx.zip Verified checksum of previously downloaded file Extracting zip contents Removing /opt/AngularProjects/router/node_modules/phantomjs-prebuilt/lib/phantom Copying extracted folder /var/folders/xz/sgpc803n1ms6xpc5n571ytc80000gn/T/phantomjs/phantomjs-2.1.1-macosx.zip-extract-1498561599287/phantomjs-2.1.1-macosx -> /opt/AngularProjects/router/node_modules/phantomjs-prebuilt/lib/phantom Writing location.js file Done. Phantomjs binary available at /opt/AngularProjects/router/node_modules/phantomjs-prebuilt/lib/phantom/bin/phantomjs > fsevents@1.1.2 install /opt/AngularProjects/router/node_modules/fsevents > node install [fsevents] Success: "/opt/AngularProjects/router/node_modules/fsevents/lib/binding/Release/node-v57-darwin-x64/fse.node" already installed Pass --update-binary to reinstall or --build-from-source to recompile npm notice created a lockfile as package-lock.json. You should commit this file. added 767 packages in 20.239s ng serve -o Unable to find "@angular/cli" in devDependencies. Please take the following steps to avoid issues: "npm install --save-dev @angular/cli@latest" You have to be inside an Angular CLI project in order to use the serve command. /opt/AngularProjects/router> npm install --save-dev @angular/cli@latest npm WARN prefer global node-gyp@3.6.2 should be installed with -g > node-sass@4.5.3 install /opt/AngularProjects/router/node_modules/node-sass > node scripts/install.js Cached binary found at /Users/jgf/.npm/node-sass/4.5.3/darwin-x64-57_binding.node > node-sass@4.5.3 postinstall /opt/AngularProjects/router/node_modules/node-sass > node scripts/build.js Binary found at /opt/AngularProjects/router/node_modules/node-sass/vendor/darwin-x64-57/binding.node Testing binary Binary is fine + @angular/cli@1.1.3 added 431 packages in 17.132s == ng -v _ _ ____ _ ___ / \ _ __ __ _ _ _| | __ _ _ __ / ___| | |_ _| / △ \ | '_ \ / _` | | | | |/ _` | '__| | | | | | | / ___ \| | | | (_| | |_| | | (_| | | | |___| |___ | | /_/ \_\_| |_|\__, |\__,_|_|\__,_|_| \____|_____|___| |___/ @angular/cli: 1.1.3 node: 8.1.2 os: darwin x64 @angular/animations: 4.2.4 @angular/common: 4.2.4 @angular/compiler: 4.2.4 @angular/compiler-cli: 4.2.4 @angular/core: 4.2.4 @angular/forms: 4.2.4 @angular/http: 4.2.4 @angular/platform-browser: 4.2.4 @angular/platform-browser-dynamic: 4.2.4 @angular/platform-server: 4.2.4 @angular/router: 4.2.4 @angular/tsc-wrapped: 4.2.4 @angular/upgrade: 4.2.4 @angular/cli: 1.1.3 ng serve -o Cannot read property 'config' of null TypeError: Cannot read property 'config' of null at Class.run (/opt/AngularProjects/router/node_modules/@angular/cli/tasks/serve.js:22:63) at check_port_1.checkPort.then.port (/opt/AngularProjects/router/node_modules/@angular/cli/commands/serve.js:110:26) at at process._tickCallback (internal/process/next_tick.js:169:7) 我怀疑这与丢失的.angular cli.json文件有关。 /opt/AngularProjects/router/node_modules/@angular/cli/models/config.d.ts
    和
    /opt/AngularProjects/router/node_modules/@angular/cli/models/config.js
    请参阅。

    该项目（zip文件中的项目）未设置为基于CLI的项目。但打开后，您可以通过执行以下操作使其运行：

    • npm安装
    • npm运行启动
    这将打开应用程序运行位置的默认浏览器

    注意：您还需要撤消所做的任何更改（或再次解压缩）

    我通过以下步骤将项目转换为CLI项目，因此我可以运行ng测试，并根据以下内容跟踪项目并运行karma测试等：

  • 使用ng new创建一个空白的新项目
  • 删除node_modules文件夹，然后将以下内容复制到现有项目中：
  • .angular cli.json
    将“name:”键重命名为package.json中“name:”的相同值
  • e2e文件夹包含：
    • 附录e2e-spec.ts
    • app.po.ts
    • tsconfig.e2e.json
  • karma.conf.js
  • progrator.conf.js
  • tsconfig.json（如有必要，将原件重命名为tsconfig.orig.json）
  • tslint.json（如有必要，将原件重命名为tsconfig.orig.json）
  • 将package.json复制到package.orig.json。然后在package.json中…：
    • 更新的脚本：更新/添加：
      • “ng”：“ng”，
      • “构建”：“ng构建”，
      • “开始”：“ng发球”，
      • “e2e”：“ng e2e”，
      • “测试”：“ng测试”，
      • “皮棉”：“ng皮棉”
    • 依赖项：
      • 使用模块更新了所有@angular
      • npm安装@angular/@最新版本--保存
        i、 e.：（以@angular/开头）动画、通用、编译器、核心、表单、http、平台浏览器、平台浏览器动态、路由器
    • 依赖性：
      • npm安装@angular/@最新版本--保存开发
        @angular/cli、@angular/compiler cli、@angular/language service
    • 我还包括在devdependences中：
      • “@types/jasmine”：“2.5.45”
      • “@types/node”：“~6.0.60”
      • “茉莉花芯”：“~2.6.2”
      • “jasmine spec reporter”：“~4.1.0”
      • “因果报应”：“^1.7.0”
      • “卡玛铬发射器”：“^2.1.1”
      • “karma cli”：“^1.0.1”
      • “因果报应报道伊斯坦布尔记者”：“^1.2.1”
      • “因果报应茉莉”：“~1.1.0”
      • “karma jasmine html reporter”：“^0.2.2”
      • “量角器”：“~5.1.2”
      • “ts节点”：“~3.0.4”
      • “tslint”：“^5.3.1”
      • “类型脚本”：“~2.3.3”
  • 在src文件夹中复制：
    • 资产/.gitcept
    • 环境/environment.prod.ts
    • 环境/environment.ts
    • 多晶硅
    • test.ts
    • tsconfig.app.json
    • tsconfig.spec.json
    • 打字
  • 替换main.ts（在我的例子中，它添加了额外的生产环境内容）
  • 在src文件夹中：
    • 重命名为tsconfig.json tsconfig.orig.json（我可以依赖tsconfig.app.json和tsconfig.spec.json）
    • 您可能需要调整index.html。我没有
  • 运行npm安装
  • 运行ng serve-o
  • 运行ng测试
    • 瞧

    注意：如果在运行ng测试时出现此错误：

    Cannot read property 'length' of undefined TypeError: Cannot read property 'length' of undefined at createSourceFile (/opt/AngularProjects/quickstart/node_modules/typescript/lib/typescript.js:15457:109) at parseSourceFileWorker (/opt/AngularProjects/quickstart/node_modules/typescript/lib/typescript.js:15389:26) at Object.parseSourceFile (/opt/AngularProjects/quickstart/node_modules/typescript/lib/typescript.js:15338:26) at Object.createSourceFile (/opt/AngularProjects/quickstart/node_modules/typescript/lib/typescript.js:15192:29) at WebpackCompilerHost.getSourceFile (/opt/AngularProjects/quickstart/node_modules/@ngtools/webpack/src/compiler_host.js:210:27) at findSourceFile (/opt/AngularProjects/quickstart/node_modules/typescript/lib/typescript.js:67909:29) at processSourceFile (/opt/AngularProjects/quickstart/node_modules/typescript/lib/typescript.js:67840:27) at processRootFile (/opt/AngularProjects/quickstart/node_modules/typescript/lib/typescript.js:67728:13) at /opt/AngularProjects/quickstart/node_modules/typescript/lib/typescript.js:67018:60 at Object.forEach (/opt/AngularProjects/quickstart/node_modules/typescript/lib/typescript.js:1449:30) at Object.createProgram (/opt/AngularProjects/quickstart/node_modules/typescript/lib/typescript.js:67018:16) at AotPlugin._setupOptions (/opt/AngularProjects/quickstart/node_modules/@ngtools/webpack/src/plugin.js:129:28) at new AotPlugin (/opt/AngularProjects/quickstart/node_modules/@ngtools/webpack/src/plugin.js:26:14) at _createAotPlugin (/opt/AngularProjects/quickstart/node_modules/@angular/cli/models/webpack-configs/typescript.js:55:12) at Object.exports.getNonAotTestConfig (/opt/AngularProjects/quickstart/node_modules/@angular/cli/models/webpack-configs/typescript.js:102:19) at WebpackTestConfig.buildConfig (/opt/AngularProjects/quickstart/node_modules/@angular/cli/models/webpack-test-config.js:16:31) 无法读取未定义的属性“length” TypeError:无法读取未定义的属性“length” 在createSourceFile（/opt/AngularProjects/quickstart/node_modules/typescript/lib/typescript.js:15457:109） 在parseSourceFileWorker（/opt/AngularProjects/quickstart/node_modules/typescript/lib/typescript.js:15389:26） 在Object.parseSourceFile（/opt/AngularProjects/quickstart/node_modules/typescript/lib/typescript.js:15338:26） 在Object.createSourceFile（/opt/AngularProjects/quickstart/node_modules/typescript/lib/typescript.js:15192:29） 在WebpackCompilerHost.getSourceFile（/opt/AngularProjects/quickstart/node_modules/@ngtools/webpack/src/compiler_host.js:210:27） 在findSourceFile（/opt/AngularProjects/quickstart/node_modules/typescript/lib/typescript.js:67909:29） 在processSourceFile（/opt/AngularProjects/quickstart/node_modules/typescript/lib/typescript.js:67840:27） 在processRootFile（/opt/AngularProjects/quickstart/node_modules/typescript/lib/typescript.js:67728:13） at/opt/AngularProjects/quickstart/node_modules/typescript/lib/typescript.js:67018:60 在Object.forEach（/opt/AngularProje Cannot read property 'length' of undefined TypeError: Cannot read property 'length' of undefined at createSourceFile (/opt/AngularProjects/quickstart/node_modules/typescript/lib/typescript.js:15457:109) at parseSourceFileWorker (/opt/AngularProjects/quickstart/node_modules/typescript/lib/typescript.js:15389:26) at Object.parseSourceFile (/opt/AngularProjects/quickstart/node_modules/typescript/lib/typescript.js:15338:26) at Object.createSourceFile (/opt/AngularProjects/quickstart/node_modules/typescript/lib/typescript.js:15192:29) at WebpackCompilerHost.getSourceFile (/opt/AngularProjects/quickstart/node_modules/@ngtools/webpack/src/compiler_host.js:210:27) at findSourceFile (/opt/AngularProjects/quickstart/node_modules/typescript/lib/typescript.js:67909:29) at processSourceFile (/opt/AngularProjects/quickstart/node_modules/typescript/lib/typescript.js:67840:27) at processRootFile (/opt/AngularProjects/quickstart/node_modules/typescript/lib/typescript.js:67728:13) at /opt/AngularProjects/quickstart/node_modules/typescript/lib/typescript.js:67018:60 at Object.forEach (/opt/AngularProjects/quickstart/node_modules/typescript/lib/typescript.js:1449:30) at Object.createProgram (/opt/AngularProjects/quickstart/node_modules/typescript/lib/typescript.js:67018:16) at AotPlugin._setupOptions (/opt/AngularProjects/quickstart/node_modules/@ngtools/webpack/src/plugin.js:129:28) at new AotPlugin (/opt/AngularProjects/quickstart/node_modules/@ngtools/webpack/src/plugin.js:26:14) at _createAotPlugin (/opt/AngularProjects/quickstart/node_modules/@angular/cli/models/webpack-configs/typescript.js:55:12) at Object.exports.getNonAotTestConfig (/opt/AngularProjects/quickstart/node_modules/@angular/cli/models/webpack-configs/typescript.js:102:19) at WebpackTestConfig.buildConfig (/opt/AngularProjects/quickstart/node_modules/@angular/cli/models/webpack-test-config.js:16:31)