[英]Creating a Typescript NPM library
I have a models
directory ( my-models
) in my project that contains a few important typescript classes for my app.我的项目中有一个
models
目录 ( my-models
),其中包含我的应用程序的一些重要的 typescript 类。
I've been using it from within the app with no problems and, now I want to make it an npm package so I can import it in another project.我一直在应用程序中毫无问题地使用它,现在我想将其设为 npm package 以便我可以将其导入另一个项目。
This is what I tried to do:这就是我试图做的:
my-models
directory (the one that contains all my models and classes) my-models
目录(包含我所有模型和类的目录)my-models
directory (the one that contains all my models and classes) my-models
目录中的 npm 链接(包含我所有模型和类的那个)my-models
in another "client" project's root directory my-models
The problem I have is that no matter what I do, I can't find a way to share all my Typescript classes and use them in another project.我遇到的问题是,无论我做什么,我都找不到一种方法来共享我所有的 Typescript 类并在另一个项目中使用它们。 I run into trouble compiling my library and then when I make it compile, I cannot import classes in my client project.
我在编译我的库时遇到了麻烦,然后当我编译它时,我无法在我的客户端项目中导入类。 I get this error:
我收到此错误:
`File '.../services/my-models/index.d.ts' is not a module.ts(2306)
`File '.../services/my-models/index.d.ts' 不是 module.ts(2306)
This is the package.json of my-models
:这是
my-models
的 package.json :
{
"name": "my-models",
"version": "0.9.0",
"description": "API Client and models",
"main": "dist/main.js",
"types": "index.d.ts",
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1"
},
"dependencies": {
"axios": "^0.19.0",
"@types/axios": "^0.14.0"
},
"devDependencies": {
"typescript": "^3.9.5"
}
}
And this is an import in my client project where I try to import one of my models:这是我的客户项目中的一个导入,我尝试导入我的一个模型:
import { Student } from 'my-models'
But wait, I kind of made it work doing this:但是等等,我有点让它工作:
import { Student } from 'my-models/dist/main'
Why?为什么? I'm saying in
my-models
's package.json that dist/main.js is the main file, why can't I just import * from "my-models"?我在
my-models
的 package.json 中说 dist/main.js 是主文件,为什么我不能从“my-models”导入*?
BTW, this is my-models/dist directory:顺便说一句,这是 my-models/dist 目录:
So not sure if I'm doing something wrong or how to do it correctly.所以不确定我是否做错了什么或如何正确地做。 Appreciate any help
感谢任何帮助
I use the Angular CLI to build NPM libraries even if they are not Angular projects.我使用 Angular CLI 构建 NPM 库,即使它们不是 Angular 项目。 You can just delete the Angular dependencies from the package.json file and you have a world class TypeScript project setup for you with a great test pipeline.
You can just delete the Angular dependencies from the package.json file and you have a world class TypeScript project setup for you with a great test pipeline.
npm install --global @angular/cli
ng new my-lib --create-application=false
cd my-lib
ng generate library my-lib
After you generate the library you can go into the projects/my-lib/src directory open the package.json file and get rid of the Angular dependencies. After you generate the library you can go into the projects/my-lib/src directory open the package.json file and get rid of the Angular dependencies. Now you have a blank TypeScript project.
现在您有一个空白的 TypeScript 项目。
ng build my-lib
will build it ng build my-lib
将构建它
ng test my-lib
will run the unit test ng test my-lib
将运行单元测试
cd into the dist/my-lib folder and you can npm publish
straight to npm. cd 进入 dist/my-lib 文件夹,您可以
npm publish
到 npm。
Why hand roll a TypeScript build when you can leverage off the work of the Angular team?当您可以利用 Angular 团队的工作时,为什么要手动推出 TypeScript 构建?
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.