可以在新的Angular项目中重新使用现有的组件吗?

huangapple go评论85阅读模式
英文:

Is it possible to re-use the existing component in new project in angular?

问题

I have one existing project ActivityManagement and I am making a new project SourceManagement.

现有项目ActivityManagement,我正在创建一个新项目SourceManagement。

Now this component of Banner, footer, and header I want to use it in my new project.
How can I use them?

现在,我想在我的新项目中使用Banner、页脚和页眉组件。我该如何使用它们?

Also one thing, the old project ActivityManagement uses an old version of

此外,旧项目ActivityManagement使用旧版本的

"@angular-devkit/build-angular": "^14.1.2",

"@angular-devkit/build-angular": "^14.1.2",

while my new angular project SourceManagement is using

而我的新Angular项目SourceManagement正在使用

"@angular-devkit/build-angular": "^16.0.0",

"@angular-devkit/build-angular": "^16.0.0",

I can change the version of the new project to a lower version.

我可以将新项目的版本更改为较低版本。

What all steps need to be considered while doing this change?

在进行此更改时需要考虑哪些步骤?

P.S - I am new to development and trying out various combinations as, if the copy-pasting works it will be really helpful as I need to make such small projects with the same component.

附言 - 我是开发新手,正在尝试各种组合,如果复制粘贴有效的话,这将非常有帮助,因为我需要制作具有相同组件的小型项目。

I tried copy-pasting the existing project package.json in the new project file, and then tried to ng build but getting an error while ng build.

我尝试将现有项目的package.json复制粘贴到新项目文件中,然后尝试ng build,但在ng build时出现错误。

英文:

I have one existing project ActivityManagement and I am making a new project SourceManagement.

可以在新的Angular项目中重新使用现有的组件吗?

Now this component of Banner , footer and header I want to use it in my new project.
How can I use them ?

Also one thing, the old project ActivityManagement > uses old version of

   "@angular-devkit/build-angular": "^14.1.2",

while my new angular project SourceManagement is using

   "@angular-devkit/build-angular": "^16.0.0",

I can change the version of new project to lower version.

What all steps need to be considered while doing this change ?

P.S - I am new to development and trying out various combinations as, if the copy pasting works it will be really helpful as I need to make such small small projects with same component.

I tried copy pasting the existing project package.json in new project file, and then tried to ng build but getting error while ng build

可以在新的Angular项目中重新使用现有的组件吗?

答案1

得分: 1

不要从package.json开始。这个文件将会变化最多。

只需复制组件文件( .scss .ts .spec.ts .html在banner/,footer/和header/内),然后导入适当的依赖项,要么将它们分配给一个模块,要么声明它们为独立的。

如果您的组件使用尚未安装在SourceManagement项目中的第三方库,您可能需要安装额外的依赖项。

英文:

Don't start with package.json. That's the file which will vary the most.

Just copy the component files (.scss, .ts, .spec.ts, .html inside banner/, footer/ and header/), then import proper dependecies and either assign them to a module or declare them as standalone.

You might need to install additional dependecies in case of your components use third party libraries, which are not yet installed in SourceManagement project.

答案2

得分: 0

The devkit version indicates the version of Angular you're using. You're trying to go from 14 to 16, and a lot of things have changed, especially the polyfills management, which is the source of your error.

Copy/pasting works only when you have coded your components very properly (single responsibility, isolation, etc). Since you are starting as you stated, I doubt you can do that.

What I would suggest to you is to either copy/paste the component you want and resolve every error one by one, or create a library, which would teach you how Angular manages shared code.

Even better, you could make a monorepository with both your applications in it, and the library as well!

Here is the documentation to get you started on the latter 2 proposals.

英文:

The devkit version indicates the version of Angular you're using. You're trying to go from 14 to 16, and lot of things have changed, especially the polyfills management, which is the source of your error.

Copy/pasting works only when you have coded your components very properly (single responsibility, isolation, etc). Since you are starting as you stated, I doubt you can do that.

What I would suggest to you, is to either copy/paste the component you want and resolve every error one by one, or create a library, which would teach you how angular manages shared code.

Even better, you could make a monorepository with both your applications in it, and the library as well !

Here is the documentation to get you started on the latter 2 proposals.

huangapple
  • 本文由 发表于 2023年6月27日 19:08:40
  • 转载请务必保留本文链接:https://go.coder-hub.com/76564247.html
匿名

发表评论

匿名网友

:?: :razz: :sad: :evil: :!: :smile: :oops: :grin: :eek: :shock: :???: :cool: :lol: :mad: :twisted: :roll: :wink: :idea: :arrow: :neutral: :cry: :mrgreen:

确定