无法使用angular-cli编译Angularjs的AngularJS

时间:2018-12-27 06:24:29

标签: angular angular-cli prismjs

我已经使用 angular-cli 创建了一个项目。我想在项目中使用 angular-prism 库。

所以我安装了

yarn add angular-prism

,然后在我的 app.module.ts

import { PrismComponent } from "angular-prism/angular-prism";

@NgModule({
  declarations: [
    AppComponent, PrismComponent
  ],
  // other code
})
export class AppModule { }

但这显示了错误

ERROR in ./node_modules/angular-prism/angular-prism.ts
Module build failed (from ./node_modules/@ngtools/webpack/src/index.js):
Error: D:\SK\Study\Angular\AngularLib\QWC\node_modules\angular-prism\angular-prism.ts is missing from the TypeScript compilation. Please make sure it is in your tsconfig via the 'files' or 'include' property.
The missing file seems to be part of a third party library. TS files in published libraries are often a sign of a badly packaged library. Please open an issue in
the library repository to alert its author and ask them to package the library using the Angular Package Format.
    at AngularCompilerPlugin.getCompiledFile (D:\SK\Study\Angular\AngularLib\QWC\node_modules\@ngtools\webpack\src\angular_compiler_plugin.js:719:23)
    at plugin.done.then (D:\SK\Study\Angular\AngularLib\QWC\node_modules\@ngtools\webpack\src\loader.js:41:31)
    at process._tickCallback (internal/process/next_tick.js:68:7)

所以我添加了

"scripts": ["../node_modules/prismjs/prism.js"]

angular.json 中。

现在显示

 91% additional asset processing scripts-webpack-plugin× 「wdm」: Error: ENOENT: no such file or directory, open 'D:\SK\Study\Angular\AngularLib\node_modules\prismjs\prism.js'
    at Object.openSync (fs.js:436:3)
    at Object.readFileSync (fs.js:341:35)
    at Storage.provideSync (D:\SK\Study\Angular\AngularLib\QWC\node_modules\enhanced-resolve\lib\CachedInputFileSystem.js:98:13)
    at CachedInputFileSystem.readFileSync (D:\SK\Study\Angular\AngularLib\QWC\node_modules\enhanced-resolve\lib\CachedInputFileSystem.js:259:32)
    at Observable.rxjs_1.Observable.obs [as _subscribe] (D:\SK\Study\Angular\AngularLib\QWC\node_modules\@ngtools\webpack\src\webpack-input-host.js:35:51)
    at Observable._trySubscribe (D:\SK\Study\Angular\AngularLib\QWC\node_modules\rxjs\internal\Observable.js:44:25)
    at Observable.subscribe (D:\SK\Study\Angular\AngularLib\QWC\node_modules\rxjs\internal\Observable.js:30:22)
    at SyncDelegateHost._doSyncCall (D:\SK\Study\Angular\AngularLib\QWC\node_modules\@angular-devkit\core\src\virtual-fs\host\sync.js:22:20)
    at SyncDelegateHost.read (D:\SK\Study\Angular\AngularLib\QWC\node_modules\@angular-devkit\core\src\virtual-fs\host\sync.js:49:21)
    at WebpackCompilerHost.readFileBuffer (D:\SK\Study\Angular\AngularLib\QWC\node_modules\@ngtools\webpack\src\compiler_host.js:124:44)
    at VirtualFileSystemDecorator.readFile (D:\SK\Study\Angular\AngularLib\QWC\node_modules\@ngtools\webpack\src\virtual_file_system_decorator.js:39:54)
    at Promise (D:\SK\Study\Angular\AngularLib\QWC\node_modules\@angular-devkit\build-angular\src\angular-cli-files\plugins\scripts-webpack-plugin.js:92:49)
    at new Promise (<anonymous>)
    at scripts.map.fullPath (D:\SK\Study\Angular\AngularLib\QWC\node_modules\@angular-devkit\build-angular\src\angular-cli-files\plugins\scripts-webpack-plugin.js:91:24)
    at Array.map (<anonymous>)
    at hook (D:\SK\Study\Angular\AngularLib\QWC\node_modules\@angular-devkit\build-angular\src\angular-cli-files\plugins\scripts-webpack-plugin.js:90:43)

我想念什么吗?

1 个答案:

答案 0 :(得分:0)

据我了解,angular-prism的构建输出未以正确的方式直接用于您的项目。因此,要使其成为编译的一部分,我需要在include下的 tsconfig.json 文件中输入以下内容

{
    "compilerOptions": {
    },
    "include": [
        "node_modules/angular-prism"
    ]
}

现在可以正常工作了!