モチベーション
多くの人が自分自身の車輪を書きたいが、あなたは常に次のような問題が発生したときに仕事を始め
- どのように基本的なJSライブラリを準備する必要があります
- ファイルがあるべき基本的なフロントエンドプロジェクト
- しかし、また、どのようにパッケージ化され、NPMにリリース
- どのように他の人がES6の構文を認識させることができます
- readmeファイルを書く必要がありますどのように
- eslintを追加する方法
- ファイル形式のUMDをパッケージ化する方法のhtmlへの直接参照を作ります
この目的を達成するために、私は、特に迅速JavaScriptのライブラリプロジェクトをビルドするためのテンプレートを作って、基本的な設定を行います。
次のように内容は以下のとおりです。
.
├── _config.yml
├── build # 打包后的项目文件目录
| ├── your-js-lib.min.js # 压缩后的js项目库文件
| └── your-js-lib.min.js.map # map文件
├── node_modules # node_modules
| └── ... # 依赖组件 ├── src # src目录 | ├── core # 源码组件目录 | └── index.js # 入口文件 ├── .babelrc # babel配置文件 ├── .gitignore # git忽略提交 ├── .npmignore # npm发表忽略提交 ├── eslintrc.json # eslin配置及规则说明 ├── LICENSE # LICENSE ├── package.json # 包依赖管理文件 ├── README.md # 项目使用说明文档 └── rollup.config.js # rollup打包工具配置文档 复制代码
開発
開発作業は、我々が通常あるときsrc
彼らのニーズに応じて、プロジェクトファイルやディレクトリを作成するディレクトリ、外国の輸出の2段階の方法を以下に示します。
ステップ1
// `src/core/`
export default a or export {a, b}
ステップ2
// `src/index.js
import YourJsLib from "./core/YourJsLib";
export default YourJsLib;
ES6糸くず
npm run lint
俵
npm run build
使用
直接参照ページで
<script src="js/your-js-lib.min.js"></script>
またはNPMを使用してインストール
npm install your-js-lib --save
...
import YourJsLib from 'your-js-lib';
PS
- 独自の開発プロセスの開発ツールに応じてプラグインをインストールする必要がEslint
- プロジェクト名の下に作成するには、NPMパッケージの必要性を公開
アイテムの参照アドレス:(問題を提供し、スターへようこそ、常にこの倉庫を向上させます。)