4

我正在尝试使用 ngx-translate 或 ng2-translate 几个月...

我继续放手一段时间，继续开发应用程序的其他部分。

我现在再次尝试使用 Core 2，但仍然没有运气。

我创建了这个项目，它运行良好。我可以更改或创建 Angular 组件，一切运行良好。

一旦我安装 ngx-translate ( https://www.npmjs.com/package/@ngx-translate/core ) 或 ng2-translate ( https://www.npmjs.com/package/ng2-translate ) 什么都没有作品。我遇到的最常见的问题是

NodeInvocationException: Prerendering failed because of error: Error: Module build failed: Error: ENOENT: no such file or directory, open 'C:\Users\Andrei\AngularDefault\SIGAD\node_modules\@angular\platform-server\bundles\platform-server.umd.js'.

我在安装时收到这些警告：

npm install @ngx-translate/core --save

npm WARN aspnet-webpack@2.0.1 requires a peer of webpack@^1.13.2 || ^2.1.0-beta but none was installed.
npm WARN karma-chai@0.1.0 requires a peer of chai@* but none was installed.
npm WARN karma-jasmine@1.1.0 requires a peer of jasmine-core@* but none was installed.
npm WARN webpack-dev-middleware@1.11.0 requires a peer of webpack@^1.0.0 || ^2.0.0 || ^3.0.0 but none was installed.
npm WARN @ngx-translate/core@7.2.0 requires a peer of @angular/core@>=2.0.0 but none was installed.
npm WARN optional SKIPPING OPTIONAL DEPENDENCY: fsevents@1.1.2 (node_modules\fsevents):
npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for fsevents@1.1.2: wanted {"os":"darwin","arch":"any
"} (current: {"os":"win32","arch":"x64"})

对于 npm 安装 @ngx-translate/http-loader

npm WARN @ngx-translate/core@7.2.0 requires a peer of @angular/core@>=2.0.0 but none was installed.
npm WARN aspnet-webpack@2.0.1 requires a peer of webpack@^1.13.2 || ^2.1.0-beta but none was installed.
npm WARN karma-chai@0.1.0 requires a peer of chai@* but none was installed.
npm WARN karma-jasmine@1.1.0 requires a peer of jasmine-core@* but none was installed.
npm WARN webpack-dev-middleware@1.11.0 requires a peer of webpack@^1.0.0 || ^2.0.0 || ^3.0.0 but none was installed.
npm WARN @ngx-translate/http-loader@1.0.2 requires a peer of @angular/core@>=4.3.0 but none was installed.
npm WARN @ngx-translate/http-loader@1.0.2 requires a peer of @angular/common@>=4.3.0 but none was installed.
npm WARN optional SKIPPING OPTIONAL DEPENDENCY: fsevents@1.1.2 (node_modules\fsevents):
npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for fsevents@1.1.2: wanted {"os":"darwin","arch":"any
"} (current: {"os":"win32","arch":"x64"})

这不是我获得“预渲染失败，因为...”的唯一文件。例如，最奇怪的是如果我下载 Mark Pieszak 模板https://github.com/MarkPieszak/aspnetcore-angular2-universal。我在错误中得到另一个文件：

NodeInvocationException: Prerendering failed because of error: Error: Module build failed: Error: ENOENT: no such file or directory, open 'C:\Users\Andrei\AngularDefault\SIGAD\node_modules\reflect-metadata\Reflect.js'
at Error (native)

没有我做任何改变......这是Windows问题还是什么？

从 github 上的其他问题和问题，例如Ionic：错误：模块构建失败：错误：ENOENT：没有这样的文件或目录 我怀疑在我将 Angular 更新到最新版本 4.3.6 之后，一些包已经改变了它们的大小写，但是我找不到他们。

我还没有编写代码来使用这些包之一......

我的 package.json 是：

{
  "name": "SIGAD",
  "private": true,
  "version": "0.0.0",
  "scripts": {
    "test": "karma start ClientApp/test/karma.conf.js"
  },
  "dependencies": {
    "@angular/animations": "4.3.6",
    "@angular/common": "4.3.6",
    "@angular/compiler": "4.3.6",
    "@angular/compiler-cli": "4.3.6",
    "@angular/core": "4.3.6",
    "@angular/forms": "4.3.6",
    "@angular/http": "4.3.6",
    "@angular/platform-browser": "4.3.6",
    "@angular/platform-browser-dynamic": "4.3.6",
    "@angular/platform-server": "4.3.6",
    "@angular/router": "4.3.6",
    "@ngtools/webpack": "1.6.2",
    "@ngx-translate/core": "^7.2.0",
    "@types/webpack-env": "1.13.0",
    "angular2-template-loader": "0.6.2",
    "aspnet-prerendering": "^3.0.1",
    "aspnet-webpack": "^2.0.1",
    "awesome-typescript-loader": "3.2.3",
    "bootstrap": "3.3.7",
    "css": "2.2.1",
    "css-loader": "0.28.5",
    "es6-shim": "0.35.3",
    "event-source-polyfill": "0.0.9",
    "expose-loader": "0.7.3",
    "extract-text-webpack-plugin": "3.0.0",
    "file-loader": "0.11.2",
    "html-loader": "0.5.1",
    "isomorphic-fetch": "2.2.1",
    "jquery": "3.2.1",
    "json-loader": "0.5.7",
    "preboot": "5.0.0",
    "raw-loader": "0.5.1",
    "reflect-metadata": "0.1.10",
    "rxjs": "5.4.3",
    "style-loader": "0.18.2",
    "to-string-loader": "1.1.5",
    "typescript": "2.4.2",
    "url-loader": "0.5.9",
    "webpack": "3.5.5",
    "webpack-hot-middleware": "2.18.2",
    "webpack-merge": "4.1.0",
    "zone.js": "0.8.17"
  },
  "devDependencies": {
    "@types/chai": "4.0.4",
    "@types/jasmine": "2.5.54",
    "chai": "4.1.1",
    "jasmine-core": "2.7.0",
    "karma": "1.7.0",
    "karma-chai": "0.1.0",
    "karma-chrome-launcher": "2.2.0",
    "karma-cli": "1.0.1",
    "karma-jasmine": "1.1.0",
    "karma-webpack": "2.0.4"
  }
}

我的 app.module.ts 是：

import { NgModule } from '@angular/core';
import { CommonModule } from '@angular/common';
import { FormsModule } from '@angular/forms';
import { HttpModule } from '@angular/http';
import { RouterModule } from '@angular/router';

import { AppComponent } from './components/app/app.component';
import { NavMenuComponent } from './components/navmenu/navmenu.component';
import { HomeComponent } from './components/home/home.component';
import { FetchDataComponent } from './components/fetchdata/fetchdata.component';
import { CounterComponent } from './components/counter/counter.component';
import { UserComponent } from "./components/user/user.component";
import { ErrorComponent } from "./components/error/error.component";

@NgModule({
    declarations: [
        AppComponent,
        NavMenuComponent,
        CounterComponent,
        FetchDataComponent,
        HomeComponent,
        UserComponent,
        ErrorComponent
    ],
    imports: [
        CommonModule,
        HttpModule,
        FormsModule,
        RouterModule.forRoot([
            { path: '', redirectTo: 'home', pathMatch: 'full' },
            { path: 'home', component: HomeComponent },
            { path: 'counter', component: CounterComponent },
            { path: 'fetch-data', component: FetchDataComponent },

            { path: 'user', component: UserComponent },
            { path: 'error', component: ErrorComponent },

            { path: '**', redirectTo: 'home' }
        ])
    ]
})
export class AppModuleShared {
}

GIT 存储库在这里https://github.com/dobrinsky/AngularDefault。

请帮助...这很难理解为什么不起作用，因为每个人都说它很容易使用...

PS我没有使用webpack。这 2 个包需要 webpack 才能运行吗？

更新：使用npm install webpack抛出

NodeInvocationException: Can't resolve all parameters for HttpXsrfCookieExtractor: (?, [object Object], [object Object])

在此之后我尝试了：

  • 完全卸载节点（以及任何版本管理器/等）
  • 转到 %AppData% / roaming 删除那里的任何 npm 或 npm 缓存文件夹
  • 重启你的机器，安装最新的 Node 6.*
  • npm i -g webpack

安装时我没有收到上述警告，但现在我得到：

Prerendering failed because of error: Error: Module build failed: TypeError: loaderUtils.getOptions is not a function
4

1 回答 1

1

你需要 在更新你的包后运行这个命令webpack --config webpack.config.js 或 webpack --config webpack.config.vendor.js 。如果它没有运行，那么你必须先使用这个命令 npm install --global webpack 安装 webpack

于 2018-01-11T05:28:17.967 回答