角6/7“依赖性的结果是表达式". [英] Angular 6 / 7 "the result of a dependency is an expression"
问题描述
我正在尝试创建Angular 6库并在Angular 6应用程序中使用它.我将其简化为一个最小的测试用例. (更新:由于Angular 7已经发布，因此我也尝试过.)
I'm trying to create an Angular 6 library and use it in an Angular 6 app. I've boiled it down to a minimal test case. (Update: since Angular 7 is out, I've tried that as well.)
ng new workspace # accept the defaults
ng new product # accept the defaults
cd workspace
ng generate library widgets
ng build --prod widgets # leave out "--prod" for Angular 7
cd ../product
ng build
一个名为工作区"的应用程序托管一个名为小部件"的库.另一个名为产品"的应用程序独立存在.到目前为止，一切都很好.
An app called "workspace" hosts a library called "widgets". Another app called "product" stands alone. Everything to this point is fine.
现在，让我们尝试在产品"应用中使用小部件"库.打开CLI生成的文件product/src/app/app.module.ts.如下所示添加两行.
Now let's try using the "widgets" library in the "product" app. Open the file product/src/app/app.module.ts which was generated by the CLI. Add two lines as shown below.
import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { AppComponent } from './app.component';
import { WidgetsModule } from '../../../workspace/dist/widgets'; // added
@NgModule({
declarations: [
AppComponent
],
imports: [
BrowserModule,
WidgetsModule // added
],
providers: [],
bootstrap: [AppComponent]
})
export class AppModule { }
所做的更改之后，当我从产品目录运行ng build时，我从Webpack收到警告.
After that change, when I run ng build from the product directory, I get warnings from Webpack.
Date: 2018-07-31T13:13:08.001Z
Hash: 8a6f58d2ae959edb3cc8
Time: 8879ms
chunk {main} main.js, main.js.map (main) 15.9 kB [initial] [rendered]
chunk {polyfills} polyfills.js, polyfills.js.map (polyfills) 227 kB [initial] [rendered]
chunk {runtime} runtime.js, runtime.js.map (runtime) 5.22 kB [entry] [rendered]
chunk {styles} styles.js, styles.js.map (styles) 15.6 kB [initial] [rendered]
chunk {vendor} vendor.js, vendor.js.map (vendor) 4.59 MB [initial] [rendered]
WARNING in ../workspace/node_modules/@angular/core/fesm5/core.js
4997:15-36 Critical dependency: the request of a dependency is an expression
WARNING in ../workspace/node_modules/@angular/core/fesm5/core.js
5009:15-102 Critical dependency: the request of a dependency is an expression
依赖关系的结果是表达式"是什么意思?我在做什么错了?
What does "the result of a dependency is an expression" mean? What am I doing wrong?
推荐答案
主要问题不是为什么您会收到该警告.您访问图书馆的方式不是理想的方式.让我们用您自己的示例步骤来研究一种更好的方法[使用Angular 7]，该方法首先不会导致该问题.
The main problem is not why you are getting that warnings. The way you are accessing the library is not an ideal way. Let's look into a little better approach [Using Angular 7] with your own sample steps, which will not cause that issue in the first place.
ng new workspace # accept the defaults
ng new product # accept the defaults
cd workspace
ng generate library widgets
ng build --prod widgets # leave out "--prod" for Angular 7
cd ../product
ng build
步骤2:创建.tgz库文件
cd ../workspace/dist/widgets/
npm pack
cp widgets-0.0.1.tgz ../../../product/
步骤3:在package.json中添加小部件"库
打开product项目的package.json文件，并在devDependencies下添加以下行:
Step 3: Add "widgets" library in package.json
Open package.json file of product project, and under devDependencies add the following line:
"widgets": "file:./widgets-0.0.1.tgz",
如果您在本地拥有该库，则需要执行步骤2和步骤3.否则，如果您的库已打包并发布到npm存储库中，则不需要file:关键字.您可以像其他依赖项一样提及该版本.
Step 2 and Step 3 are required if you have the library locally. Otherwise, if your library is packed and publish into npm repository, then you don't need file: keyword. You can just mention the version like other dependencies.
在产品项目中运行npm install.
修改app.module.ts文件:
import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { AppComponent } from './app.component';
import { WidgetsModule } from 'widgets'; // new line
@NgModule({
declarations: [
AppComponent
],
imports: [
BrowserModule,
WidgetsModule // new line
],
providers: [],
bootstrap: [AppComponent]
})
export class AppModule { }
第6步:构建产品项目
现在，在产品项目中运行ng build.它将成功运行.
Step 6: Build product project
Now, run ng build in product project. It will run successfully.
这篇关于角6/7“依赖性的结果是表达式".的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
