サイドバー
typescript:moduleのimport
以前のリビジョンの文書です
moduleのimport
関数などを別ファイルに分割したい場合。
1.moduleを分ける
- comm/func.ts
export function getAsterString(target:string):string{ return "*" + target + "*" }
- main.ts
import { getAsterString } from "./comm/func" console.log(getAsterString("aaa"))
2.tsconfig.jsonの確認
- tsconfig.json
"target": "es5", /* Specify ECMAScript target version: 'ES3' (default), 'ES5', 'ES2015', 'ES2016', 'ES2017', 'ES2018', 'ES2019', 'ES2020', or 'ESNEXT'. */ "module": "commonjs", /* Specify module code generation: 'none', 'commonjs', 'amd', 'system', 'umd', 'es2015', 'es2020', or 'ESNext'. */ ↓moduleの設定を変える "target": "es5", /* Specify ECMAScript target version: 'ES3' (default), 'ES5', 'ES2015', 'ES2016', 'ES2017', 'ES2018', 'ES2019', 'ES2020', or 'ESNEXT'. */ "module": "es2015", /* Specify module code generation: 'none', 'commonjs', 'amd', 'system', 'umd', 'es2015', 'es2020', or 'ESNext'. */
3.htmlでインポート
tsc の–outオプションを付けて1つのファイルにまとめて出力するか、出来上がったjsファイルをすべて参照する必要がある。
- index.html
<body> ... <script src="./comm/func.js"></script> <script src="./main.js"></script> </body> </html>
// 実際にはまとまらない... >tsc main.ts comm/func.ts --out all.js comm/func.ts:1:17 - error TS6131: Cannot compile modules using option 'out' unless the '--module' flag is 'amd' or 'system'.
4.tscでコンパイル
>tsc main.ts comm/func.ts
typescript/moduleのimport.1600704535.txt.gz · 最終更新: 2020/09/22 01:08 by ips
