PolymerTS 项目使用教程
1. 项目的目录结构及介绍
PolymerTS 项目的目录结构如下:
PolymerTS/
├── demo/
│ ├── index.html
│ ├── my-app.html
│ ├── my-element.html
│ └── my-list.html
├── dist/
│ ├── polymer-ts.d.ts
│ └── polymer-ts.min.js
├── src/
│ ├── polymer-ts.d.ts
│ └── polymer-ts.js
├── test/
│ ├── basic-test.html
│ ├── basic-test.js
│ ├── define-test.html
│ ├── define-test.js
│ ├── dom-test.html
│ ├── dom-test.js
│ ├── extend-test.html
│ ├── extend-test.js
│ ├── properties-test.html
│ ├── properties-test.js
│ ├── ready-test.html
│ ├── ready-test.js
│ ├── template-test.html
│ ├── template-test.js
│ ├── two-way-test.html
│ └── two-way-test.js
├── .gitignore
├── .npmignore
├── bower.json
├── LICENSE
├── package.json
├── polymer-ts.js
├── polymer-ts.min.js
├── README.md
└── tsconfig.json
目录介绍
demo/
: 包含示例项目的 HTML 文件。dist/
: 包含编译后的文件,如polymer-ts.min.js
和polymer-ts.d.ts
。src/
: 包含源代码文件,如polymer-ts.js
和polymer-ts.d.ts
。test/
: 包含测试文件,用于测试项目的各个功能。.gitignore
: Git 忽略文件列表。.npmignore
: npm 忽略文件列表。bower.json
: Bower 包管理文件。LICENSE
: 项目许可证。package.json
: npm 包管理文件。polymer-ts.js
: 项目的主文件。polymer-ts.min.js
: 压缩后的主文件。README.md
: 项目说明文档。tsconfig.json
: TypeScript 配置文件。
2. 项目的启动文件介绍
项目的启动文件是 demo/index.html
。这个文件包含了项目的入口点,用于展示和测试项目的功能。
<!DOCTYPE html>
<html>
<head>
<title>PolymerTS Demo</title>
<script src="../polymer-ts.min.js"></script>
<link rel="import" href="my-app.html">
</head>
<body>
<my-app></my-app>
</body>
</html>
启动文件介绍
<script src="../polymer-ts.min.js"></script>
: 引入项目的核心文件。<link rel="import" href="my-app.html">
: 引入自定义元素my-app
。<my-app></my-app>
: 在页面中使用自定义元素my-app
。
3. 项目的配置文件介绍
项目的配置文件主要包括 package.json
和 tsconfig.json
。
package.json
package.json
文件包含了项目的元数据和依赖项。
{
"name": "polymer-ts",
"version": "0.1.21",
"description": "Polymer 1.0 bindings for TypeScript",
"main": "polymer-ts.js",
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1"
},
"repository": {
"type": "git",
"url": "git+https://github.com/nippur72/PolymerTS.git"
},
"keywords": [
"polymer",
"typescript"
],
"author": "Antonino Porcino <nino.porcino@gmail.com>",
"license": "MIT",
"bugs": {
"url": "https://github.com/nippur72/PolymerTS/issues"