npmパッケージ(ホイール)を迅速に開発

多くの人が自分の車輪を書きたいと思っていますが、手を出し始めたとき、あなたはいつも以下の問題に遭遇します.

基本的なjsライブラリは、

をどのように記述すべきか

基本的なフロントエンドプロジェクトに必要なファイル

はまたどのようにnpmの上で

にパッケージして発表します

あなたのes 6文法はどのようにして他の人に

を認識させることができますか?

readme

の作成方法

eslint

の追加方法

umd形式のファイルをパッケージ化してhtmlに

を直接参照させるにはどうすればいいですか?
そのため、JavaScriptプロジェクトライブラリを迅速に構築するテンプレートを作成し、基本的な構成をしました.
ディレクトリは次のとおりです.

.
├── 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つのステップで対外exportを作成します.
step1

// `src/core/`
export default a or export {a, b}

step2

// `src/index.js
import YourJsLib from "./core/YourJsLib";
export default YourJsLib;

es6 lint

npm run lint

梱包する

npm run build

使用
直接ページ参照

Or install using npm

npm install your-js-lib --save
...

import YourJsLib from 'your-js-lib';

PS

プロセスでは、 の ツールに ってeslintプラグイン

をインストールする があります.

npmパッケージのパブリケーションは、プロジェクト に づいて

を する があります.
プロジェクトリファレンスアドレス:(star、issuesを し、 を えず することを します.)
YourJsLib