Skip to content

Commit 6e9b0e2

Browse files
committed
Create and update docs/quick/library.md.
1 parent 6de8ce8 commit 6e9b0e2

File tree

1 file changed

+62
-0
lines changed

1 file changed

+62
-0
lines changed

docs/quick/library.md

Lines changed: 62 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,62 @@
1+
## TypeScriptのnode moduleを作成する
2+
3+
* [Typecriptのnodemoduleの作成に関するレッスン](https://egghead.io/lessons/typescript-create-high-quality-npm-packages-using-typescript)
4+
5+
TypeScriptで書かれたモジュールを使用することは、コンパイル時の安全性とオートコンプリートが得られるので、非常に楽しいことです。
6+
7+
TypeScript modules can be consumed both in the nodejs (as is) browser (with something like webpack).
8+
9+
高品質のTypeScriptモジュールの作成は簡単です。以下の望ましいフォルダ構造を仮定します。
10+
11+
```text
12+
package
13+
├─ package.json
14+
├─ tsconfig.json
15+
├─ src
16+
│ ├─ index.ts
17+
│ ├─ foo.ts
18+
│ └─ ...All your source files (Authored)
19+
└─ lib
20+
├─ index.d.ts.map
21+
├─ index.d.ts
22+
├─ index.js
23+
├─ foo.d.ts.map
24+
├─ foo.d.ts
25+
├─ foo.js
26+
└─ ... All your compiled files (Generated)
27+
```
28+
29+
* `src/index.ts`: Here you would export anything you expect to be consumed from your project. E.g `export { Foo } from './foo';`. Exporting from this file makes it available for consumption when someone does `import { /* Here */ } from 'example';`
30+
31+
* `tsconfig.json`について
32+
* `compilerOptions``"outDir": "lib"`と、`"declaration": true``"declarationMap" : true`を設定します < これはlibフォルダに`.js` (JavaScript) `.d.ts` (declarations for TypeSafety) and `.d.ts.map` (enables `declaration .d.ts` => `source .ts` IDE navigation)生成します
33+
* `include: ["src"]`を設定します < これは`src`ディレクトリからのすべてのファイルを対象に含めます
34+
35+
* `package.json`について
36+
* `"main": "lib/index"` <これはNode.jsに`lib/index.js`をロードするように指示します
37+
  * `"types": "lib/index"` <これはTypeScriptに`lib/index.d.ts`をロードするように指示します
38+
39+
40+
パッケージの例:
41+
* `npm install typestyle` [for TypeStyle](https://www.npmjs.com/package/typestyle)
42+
* 使用法:`import { style } from 'typestyle';`は、完全な型安全性を提供します
43+
44+
### Managing Dependencies
45+
46+
#### devDependencies
47+
48+
* If your package depends on another package while you are developing it (e.g. `prettier`) you should install them as a `devDependency`. This way they will not pollute the `node_modules` of your module's consumers (as `npm i foo` does not install `devDependencies` of `foo`).
49+
* `typescript` is normally a `devDependency` as you only use it to build your package. The consumers can use your package with or without TypeScript.
50+
* If your package depends on other JavaScript authored packages and you want to use it with type safety in your project, put their types (e.g. `@types/foo`) in `devDependencies`. JavaScript types should be managed *out of bound* from the main NPM streams. The JavaScript ecosystem breaks types without semantic versioning too commonly, so if your users need types for these they should install the `@types/foo` version that works for them. If you want to guide users to install these types you can put them in `peerDependencies` mentioned next.
51+
52+
#### peerDependencies
53+
54+
If your package depends on a package that it heavily *works with* (as opposed to *works using*) e.g. `react`, put them in `peerDependencies` just like you would with raw JS packages. To test them locally you should also put them in `devDependencies`.
55+
56+
Now:
57+
* When you are developing the package you will get the version of the dependency you specified in your `devDependencies`.
58+
* When someone installs your package they will *not* get this dependency (as `npm i foo` does not install `devDependencies` of `foo`) but they will get a warning that they should install the missing `peerDependencies` of your package.
59+
60+
#### dependencies
61+
62+
If your package *wraps* another package (meant for internal use even after compilation) you should put them in `dependencies`. Now when someone installs your package they will get your package + any of its dependencies.

0 commit comments

Comments
 (0)