我想在这个帖子中跟踪和更新最新的(并且希望是最简单的)方法来捆绑Angular(版本2,4,...)以便在实时Web服务器上进行生产.
请在答案中包含Angular版本,以便我们可以更好地跟踪它何时转移到更高版本.
更新到Angular 6.0.1后,我收到以下错误ng serve:
Could not find module "@angular-devkit/build-angular" from "/home/Projects/myProjectName".
Error: Could not find module "@angular-devkit/build-angular" from "/home/Projects/myProjectName".
at Object.resolve (/home/Projects/myProjectName/node_modules/@angular-devkit/core/node/resolve.js:141:11)
at Observable.rxjs_1.Observable [as _subscribe] (/home/Projects/myProjectName/node_modules/@angular-devkit/architect/src/architect.js:132:40)
ng update说一切都井然有序.删除node_modules文件夹和全新npm install安装也没有帮助.
我的项目基于[ng2-admin(Angular4版本)].(https://github.com/akveo/ngx-admin)这是我的package.json dependecies:
"dependencies": {
"@angular/animations": "^6.0.1",
"@angular/common": "^6.0.1",
"@angular/compiler": "^6.0.1",
"@angular/core": "^6.0.1",
"@angular/forms": "^6.0.1",
"@angular/http": "^6.0.1",
"@angular/platform-browser": "^6.0.1",
"@angular/platform-browser-dynamic": "^6.0.1",
"@angular/platform-server": "^6.0.1",
"@angular/router": "^6.0.1",
"@ng-bootstrap/ng-bootstrap": "1.0.0-alpha.26",
"@ngx-translate/core": "^10.0.1",
"@ngx-translate/http-loader": "^3.0.1",
"amcharts3": "github:amcharts/amcharts3",
"ammap3": "github:amcharts/ammap3",
"angular-table": "^1.0.4",
"angular2-csv": "^0.2.5",
"angular2-datatable": "0.6.0",
"animate.css": "3.5.2",
"bootstrap": "4.0.0-alpha.6", …我是Angular的新手,我来自Ember社区.尝试使用基于Ember-CLI的新Angular-CLI.
我需要知道在新的Angular项目中处理SASS的最佳方法.我尝试使用ember-cli-sassrepo来查看它是否会发挥作用,因为Angular-CLI的许多核心组件都是使用Ember-CLI模块运行的.
它没有用,但又不确定我是否只是错误配置了一些东西.
另外,在新的Angular项目中组织样式的最佳方法是什么？将sass文件放在与组件相同的文件夹中会很不错.
运行时,ng serve我收到有关我的全局CLI版本大于本地版本的警告.我没有注意到这个警告的任何问题,但我想知道这两个版本是否应该同步？此外,如果您有全球版本,是否有必要拥有本地版本？
警告:
您的全局Angular CLI版本(1.1.1)大于本地版本(1.0.6).使用本地Angular CLI版本.
我正在使用Angular 2+和Angular CLI.
如何为我的项目添加font-awesome？
我们想在使用angular-cli 1.0.0-beta.5(w/node v6.1.0)生成的应用程序中使用bootstrap 4(4.0.0-alpha.2).
在使用npm获取引导程序及其依赖项后,我们的第一种方法是将它们添加到angular-cli-build.js:
'bootstrap/dist/**/*.min.+(js|css)',
'jquery/dist/jquery.min.+(js|map)',
'tether/dist/**/*.min.+(js|css)',
并将它们导入我们的 index.html
<script src="vendor/jquery/dist/jquery.min.js"></script>
<script src="vendor/tether/dist/js/tether.min.js"></script>
<link rel="stylesheet" type="text/css" href="vendor/bootstrap/dist/css/bootstrap.min.css">
<script src="vendor/bootstrap/dist/js/bootstrap.min.js"></script>
这很好用,ng serve但是一旦我们生成了带有-prod标志的构建,所有这些依赖关系都消失了dist/vendor(惊喜!).
我们打算如何在使用angular-cli生成的项目中处理这种情况(即加载引导程序脚本)？
我们有以下想法,但我们真的不知道要走哪条路......
使用CDN？但我们宁愿提供这些文件以保证它们可用
复制依赖关系到dist/vendor我们之后ng build -prod？但这似乎是angular-cli应该提供的东西,因为它"照顾"构建部分？
在src/system-config.ts中添加jquery,bootstrap和tether,并以某种方式将它们拉入main.ts中的bundle中？但考虑到我们不打算在我们的应用程序代码中明确使用它们(例如,不像moment.js或像lodash这样的东西),这似乎是错误的
我尝试使用"ng destroy component foo",它告诉我"Angular-CLI不支持destroy命令"
我们如何使用Angular CLI正确删除组件？
Lint错误消息:
src/app/detail/edit/edit.component.ts [111,5]:for(... in ...)语句必须用if语句过滤
代码片段(这是一个工作代码.它也可以在angular.io表单验证部分获得):
for (const field in this.formErrors) {
// clear previous error message (if any)
this.formErrors[field] = '';
const control = form.get(field);
if (control && control.dirty && !control.valid) {
const messages = this.validationMessages[field];
for (const key in control.errors) {
this.formErrors[field] += messages[key] + ' ';
}
}
}
知道如何修复这个lint错误吗？
我想用5000而不是4200 ..
我试过的是我在根名称上创建了一个文件,ember-cli并根据下面的代码放置了JSON:
{
"port": 5000
}
但我的应用程序仍然运行4200而不是5000
我已经travis-ci与我的GitHub帐户集成(https://github.com/pradeep0601/Angular5-Router-App).
当我将@angular/cli版本从1.7.4 更新到6.0.0-rc.3时,构建开始失败并出现错误:
Local workspace file ('angular.json') could not be found.
Error: Local workspace file ('angular.json') could not be found.
at WorkspaceLoader._getProjectWorkspaceFilePath (/home/travis/build/pradeep0601/Angular5-Router-App/node_modules/@angular/cli/models/workspace-loader.js:37:19)
at WorkspaceLoader.loadWorkspace (/home/travis/build/pradeep0601/Angular5-Router-App/node_modules/@angular/cli/models/workspace-loader.js:24:21)
at TestCommand._loadWorkspaceAndArchitect (/home/travis/build/pradeep0601/Angular5-Router-App/node_modules/@angular/cli/models/architect-command.js:177:32)
at TestCommand.<anonymous> (/home/travis/build/pradeep0601/Angular5-Router-App/node_modules/@angular/cli/models/architect-command.js:45:25)
at Generator.next (<anonymous>)
at /home/travis/build/pradeep0601/Angular5-Router-App/node_modules/@angular/cli/models/architect-command.js:7:71
at new Promise (<anonymous>)
at __awaiter (/home/travis/build/pradeep0601/Angular5-Router-App/node_modules/@angular/cli/models/architect-command.js:3:12)
at TestCommand.initialize (/home/travis/build/pradeep0601/Angular5-Router-App/node_modules/@angular/cli/models/architect-command.js:44:16)
at /home/travis/build/pradeep0601/Angular5-Router-App/node_modules/@angular/cli/models/command-runner.js:100:23
package.json片段以更好地了解运行环境:
"@angular/cli": "6.0.0-rc.3",
"@angular/compiler-cli": "^5.2.0",
"@angular/language-service": "^5.2.0",
"@types/jasmine": "~2.8.3",
"@types/jasminewd2": "~2.0.2",