unpkg 项目教程

unpkg 项目教程

unpkg The CDN for everything on npm 项目地址: https://gitcode.com/gh_mirrors/un/unpkg

1. 项目的目录结构及介绍

unpkg 项目的目录结构如下：

unpkg/
├── modules/
├── plugins/
├── public/
├── scripts/
├── sponsors/
├── .eslintignore
├── .eslintrc
├── .gitignore
├── .nvmrc
├── .prettierignore
├── .prettierrc
├── LICENSE
├── README.md
├── SPONSORS.md
├── fly.toml
├── jest.config.js
├── package.json
├── rollup.config.js
├── unpkg.sketch
└── yarn.lock

目录介绍：

• modules/: 存放项目的主要模块代码。
• plugins/: 存放项目的插件代码。
• public/: 存放公共资源文件。
• scripts/: 存放项目的脚本文件。
• sponsors/: 存放赞助商相关文件。
• .eslintignore: ESLint 忽略文件配置。
• .eslintrc: ESLint 配置文件。
• .gitignore: Git 忽略文件配置。
• .nvmrc: Node 版本管理配置文件。
• .prettierignore: Prettier 忽略文件配置。
• .prettierrc: Prettier 配置文件。
• LICENSE: 项目许可证文件。
• README.md: 项目介绍和使用说明文件。
• SPONSORS.md: 赞助商列表文件。
• fly.toml: Fly 配置文件。
• jest.config.js: Jest 测试配置文件。
• package.json: 项目依赖和脚本配置文件。
• rollup.config.js: Rollup 打包配置文件。
• unpkg.sketch: Sketch 设计文件。
• yarn.lock: Yarn 依赖锁定文件。

2. 项目的启动文件介绍

unpkg 项目的启动文件主要是 package.json 中的 scripts 部分。以下是一些关键的启动脚本：

{
  "scripts": {
    "start": "node index.js",
    "build": "rollup -c",
    "test": "jest"
  }
}

启动脚本介绍：

• start: 启动项目的命令，通常是 node index.js。
• build: 使用 Rollup 进行打包的命令。
• test: 使用 Jest 进行测试的命令。

3. 项目的配置文件介绍

unpkg 项目中有多个配置文件，以下是一些关键的配置文件及其作用：

3.1 .eslintrc

ESLint 配置文件，用于定义代码风格和规则：

{
  "extends": "eslint:recommended",
  "rules": {
    "no-console": "off"
  }
}

3.2 jest.config.js

Jest 测试配置文件，用于定义测试环境、匹配器等：

module.exports = {
  testEnvironment: 'node',
  testMatch: ['**/__tests__/**/*.js?(x)', '**/?(*.)+(spec|test).js?(x)']
};

3.3 rollup.config.js

Rollup 打包配置文件，用于定义打包规则、输出格式等：

export default {
  input: 'src/main.js',
  output: {
    file: 'dist/bundle.js',
    format: 'cjs'
  }
};

3.4 package.json

项目依赖和脚本配置文件，包含项目的元数据、依赖包、启动脚本等：

{
  "name": "unpkg",
  "version": "1.0.0",
  "scripts": {
    "start": "node index.js",
    "build": "rollup -c",
    "test": "jest"
  },
  "dependencies": {
    "express": "^4.17.1"
  },
  "devDependencies": {
    "jest": "^26.6.3",
    "rollup": "^2.3.4"
  }
}

通过以上配置文件，可以对 unpkg 项目进行代码风格检查、测试、打包等操作。

unpkg The CDN for everything on npm 项目地址: https://gitcode.com/gh_mirrors/un/unpkg