如何将未使用Angular CLI创建的Angular应用程序迁移到Angular CLI项目? [英] How to migrate an Angular Application that was not created with the Angular CLI to an Angular CLI project?

问题描述

我已经使用诸如 NPM 之类的工具开发了Angular应用程序(我没有使用Angular CLI).将项目迁移到CLI项目模型的最佳方法是什么?例如，我希望能够使用ng serve之类的命令.

I have developed an Angular application using tools such as NPM (I did not use the Angular CLI). What is the best way to migrate the project to the CLI project model? For example, I want to be able to use commands like ng serve.

推荐答案

要将Angular项目转换为使用 Angular CLI ，您可以按照以下步骤操作.

To convert an Angular project to use the Angular CLI, you could follow these steps.

npm install -g @angular/cli

2.创建一个新的CLI项目

ng new my-first-project
cd my-first-project
ng serve

3.将您现有的代码文件复制到新的CLI项目中

4. 配置您的Angular工作区

Angular CLI与其他构建系统之间的差异

来自将项目迁移到Angular CLI构建系统的注释

3. Copy your existing code files into the new CLI Project

4. Configure your Angular Workspace

Differences between Angular CLI and Other Build Systems

Notes from Migrating a project to Angular CLI build system

• Angular CLI可能使用多个tsconfig.json文件(请确保正确设置文件之间的依赖关系)
• ng serve和ng test将您的打字稿编译到内存中，而不是物理文件中.
• 如果ng test无法正常工作并出现神秘错误，请查看pollyfills.ts文件并开始取消注释行.
• 考虑使用精确的版本号，shrinkwrap，lockfile或yarn锁定package.json版本.调试@types，tsc版本和不兼容的模块没有乐趣.
• 使用ng build --prod(使用AOT编译)进行构建比使用ng serve的默认打字稿规则要严格得多.
• 使用sass作为CSS:

• Angular CLI may use multiple tsconfig.json files (be sure to setup dependencies between files correctly)
• ng serve and ng test compile your typescript into memory rather than physical files.
• If ng test doesn't work and gives cryptic errors look into the pollyfills.ts file and start uncommenting lines.
• Consider locking package.json versions with exact version numbers, shrinkwrap, lockfile, or yarn. There is no joy in debugging @types, tsc versions and incompatible modules.
• Building with ng build --prod (which uses AOT compilation) is a lot more strict than the default typescript rules with ng serve.
• Using sass for css:

1. 创建新项目时:ng new my-first-app --style=scss
2. 或修改angular.json:

1. When creating new project: ng new my-first-app --style=scss
2. Or modify angular.json:

"schematics": {
      "@schematics/angular:component": {
      "styleext": "scss"
    }
}

这篇关于如何将未使用Angular CLI创建的Angular应用程序迁移到Angular CLI项目?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！