标签: angular-cli

在Angularjs 2中获取没有spec.ts文件的Component

每当我创建一个新组件时,有没有办法摆脱Angularjs 2中的spec.ts文件.我知道这是出于测试目的,但如果我不需要它会怎样.

可能有一些设置来禁用此特定测试文件.

angular-cli angular-components angular

33
推荐指数
8
解决办法
4万
查看次数

在Angular中导入和使用lodash的正确方法

我曾经能够通过导入语句在Angular中使用lodash方法,如下所示:

import {debounce as _debounce} from 'lodash';
Run Code Online (Sandbox Code Playgroud)

我现在在使用该语句时收到以下错误:

'"{...}/node_modules/@types/lodash/index"' has no exported member 'debounce'.
Run Code Online (Sandbox Code Playgroud)

唯一能编译而没有错误的是这句话:

import * as _ from 'lodash'; 
Run Code Online (Sandbox Code Playgroud)

在我的代码中,我_debounce()改为_.debounce().这是唯一(和/或正确)的方式吗?有没有办法只进口去抖,还是由于"树木"而无关紧要?我意识到我可以编写自己的去抖函数,但我主要对"正确"的方法感兴趣.

ps我尝试过的其他变体(每种变体都有一些与之相关的错误):

import {debounce as _debounce } from 'lodash/debounce';
import * as _debounce from 'lodash/debounce';
import debounce = require('lodash/debounce');
Run Code Online (Sandbox Code Playgroud)

仅供参考...我使用以下版本:

角度:2.4.5

打字稿:2.1.5

Angular-cli:1.0.0-beta.26

typescript angular-cli angular

33
推荐指数
3
解决办法
2万
查看次数

使用ng build --prod剥离所有注释和console.log可能吗?

我正在使用MEAN,Angular 2,Node/Express,Angular-CLI和ng build --prod构建我的应用程序,我对我的应用程序中的一次性注释代码和十亿次调试console.log语句进行了讽刺.有没有办法让构建过程在构建时删除所有注释和console.log语句?手动做的想法是可怕的!

angular-cli angular

33
推荐指数
3
解决办法
2万
查看次数

不再需要 core-js 了吗?

我已经将一个 Angular 项目从版本 7 更新到了 8。一切运行顺利,原理图完成了它的工作(也许),我们还好(项目甚至在生产中)。当我们更新 Angular CLI 时,我们总是会生成一个新项目来查看真正的差异并从中学习,例如新的依赖项、配置等。

使用 Angular CLI 8.0.4 生成新的 Angular 项目时,新应用程序没有core-js依赖项:

"dependencies": {
    "@angular/animations": "~8.0.1",
    "@angular/common": "~8.0.1",
    "@angular/compiler": "~8.0.1",
    "@angular/core": "~8.0.1",
    "@angular/forms": "~8.0.1",
    "@angular/platform-browser": "~8.0.1",
    "@angular/platform-browser-dynamic": "~8.0.1",
    "@angular/router": "~8.0.1",
    "rxjs": "~6.4.0",
    "tslib": "^1.9.0",
    "zone.js": "~0.9.1"
  }
Run Code Online (Sandbox Code Playgroud)

core-js不存在对构建项目的分析包: 没有 core-js 的捆绑包 在我使用 Angular CLI 更新的项目中,core-js是否存在并且存在于最终包中:

"dependencies": {
    "@angular/animations": "~8.0.3",
    "@angular/cdk": "~8.0.1",
    "@angular/common": "~8.0.3",
    "@angular/compiler": "~8.0.3",
    "@angular/core": "~8.0.3",
    "@angular/forms": "~8.0.3",
    "@angular/platform-browser": "~8.0.3",
    "@angular/platform-browser-dynamic": "~8.0.3",
    "@angular/router": "~8.0.3",
    "@auth0/angular-jwt": "2.1.1",
    "@hackages/ngxerrors": "~8.0.0",
    "@ng-bootstrap/ng-bootstrap": "5.0.0-rc.1",
    "@ngx-loading-bar/core": …
Run Code Online (Sandbox Code Playgroud)

angular-cli angular angular8

33
推荐指数
2
解决办法
2万
查看次数

我该如何解决使用 ng new 时出现的错误?

我已经使用命令 npm install -g @angular/cli 安装了 angular-cli。当我尝试运行命令 ng new 并创建新项目时,出现错误:

\n
\xe2\xa0\x99 Installing packages (npm)...npm WARN deprecated source-map-resolve@0.6.0: See https://github.com/lydell/source-map-resolve#deprecated\nnpm ERR! code E404\nnpm ERR! 404 Not Found - GET https://registry.npmjs.org/@types/eslint/-/eslint-8.4.4.tgz - Not found\nnpm ERR! 404 \nnpm ERR! 404  '@types/eslint@https://registry.npmjs.org/@types/eslint/-/eslint-8.4.4.tgz' is not in this registry.\nnpm ERR! 404 You should bug the author to publish it (or use the name yourself!)\nnpm ERR! 404 \nnpm ERR! 404 Note that you can also install from a\nnpm ERR! 404 tarball, folder, http url, or git …
Run Code Online (Sandbox Code Playgroud)

npm angular-cli

33
推荐指数
1
解决办法
4678
查看次数

让Angular使用限制性内容安全策略(CSP)

我无法使基础Angular2(最终)应用程序与以下限制性CSP一起使用.

default-src 'none';
script-src 'self';
style-src 'self';
font-src 'self';
img-src 'self' data:;
connect-src 'self'
Run Code Online (Sandbox Code Playgroud)

有一个不安全的-EVAL错误lang.js和两个zone.js.你能提供解决方案吗?

步骤使用Angular CLI重现

我创建了一个GitHub存储库.您也可以按照以下说明操作.

将最后一个Angular CLI与webpack 6.0.8一起使用,并使用下面的说明创建新应用程序.

ng new csp-test
Run Code Online (Sandbox Code Playgroud)

在index.html中插入定义以下限制性内容安全策略的元标记.

<meta 
  http-equiv="Content-Security-Policy" 
  content="default-src 'none';script-src 'self';style-src 'self';font-src 'self';img-src 'self' data:;connect-src 'self'">
Run Code Online (Sandbox Code Playgroud)

然后提供申请.

ng serve
Run Code Online (Sandbox Code Playgroud)

访问http:// localhost:4200 /,由于脚本被CSP阻止,因此页面无法加载.

错误

Chrome中出错

lang.js

lang.js:335 Uncaught EvalError: Refused to evaluate a string as JavaScript because 'unsafe-eval' is not an allowed source of script in the following Content Security Policy directive: "script-src …
Run Code Online (Sandbox Code Playgroud)

content-security-policy angular-cli angular

32
推荐指数
2
解决办法
6810
查看次数

如何使用Angula2 CLI在特定文件夹中生成类?

我通常使用以下命令生成角度为2 cli的类:

ng g class todo

如何告诉cli在特定文件夹中生成类,例如models文件夹.

该文档有一个示例,它在特定文件夹中生成一个组件,但我没有成功使用类选项

我尝试了以下选项:

ng g class models/todo

ng g class ../models todo

ng g class models todo

它们导致路径无效的错误,这使我认为该选项受支持但我无法弄清楚,或者在后者的情况下将目标文件夹名称与类名合并.

angular-cli angular

32
推荐指数
5
解决办法
4万
查看次数

如何删除使用Angular-CLI创建的组件

我正在使用angular2为我的新项目,新技术.我用角度CLI设置了我的项目(参考站点https://github.com/angular/angular-cli).我使用命令创建了4个组件ng generate component my-new-component 为了测试目的,创建了一个组件应用程序测试,需要从我的项目中删除该组件.否则需要重命名该组件.我试过好几个.ng destroy component app-testing但显示错误Angular-CLI不支持destroy命令.,请帮我解决.提前致谢.

angular-cli angular

32
推荐指数
2
解决办法
12万
查看次数

错误:请将您的依赖项升级到 core-js@3 的实际版本

我正在尝试运行npm start但给我错误“发生未处理的异常:找不到模块“@angular-devkit/build-angular”我也尝试通过使用安装它,npm install @angular-devkit/build-angular但仍然出现错误。

错误“npm WARN deprecated core-js@2.6.11: core-js@<3 不再维护,由于问题数量不推荐使用。请将您的依赖项升级到 core-js@3 的实际版本.”

如何升级我的依赖项?

npm angular-cli angular

32
推荐指数
3
解决办法
6万
查看次数

ng test和ng e2e之间的真正区别是什么?

我担心有人会提出我的问题,但我找不到令人满意的问题(也许是因为我在Angular 2+世界中非常有限,我理解错了).

据我所知,在完成了几个Hello World之后我很难理解,很少有YouTube演示观看:

ng测试:

  • 你用Jasmine语言编写测试
  • 您可以使用Karma使用许多浏览器测试您的测试
  • 您执行单元或集成测试
  • 所有xxx.compnent.spec.ts运行,并在浏览器中显示类似于JUnit的最终报告

ng e2e:

  • 你用Jasmine语言编写测试
  • 您可以使用Karma使用许多浏览器测试您的测试
  • 您在编写嵌套用户事件时编写测试

    eg. page.navigateTo();
    page.getParagraphText()
      .then(msg => expect(msg).toEqual('Welcome to app!!'))
      .then(msg => expect(msg).toEqual('xxx'))
      .then(done, done.fail);
    
    Run Code Online (Sandbox Code Playgroud)
  • 您使用量角器执行端到端测试主要是在部署应用程序后的一种预生产环境

  • 触发e2e文件夹下的测试,并在命令行控制台中打印结果

Theoracly说,第二个是特定的端到端,其重点是模拟最终用户完成的整个流程.

希望,直到这里是正确的,我想知道幕后发生了什么真正使他们与众不同.我不想比较哪个更好但是我肯定错过了一些点,因为我使用完全相同的想法创建了一些测试,并且我通过ng测试触发了它.

例如:

...

it('should display the modal when `create Paste` is clicked', () => {

    let createPasteButton = fixture.debugElement.query(By.css("button"));
    //create a spy on the createPaste  method
    spyOn(component,"createPaste").and.callThrough();

    //triggerEventHandler simulates a click event on the button object
    createPasteButton.triggerEventHandler('click',null);

    //spy checks whether the method was called
    expect(component.createPaste).toHaveBeenCalled();
    fixture.detectChanges();
    expect(component.showModal).toBeTruthy("showModal should …
Run Code Online (Sandbox Code Playgroud)

jasmine protractor karma-jasmine angular-cli angular

31
推荐指数
1
解决办法
9204
查看次数