パックされた外部JSファイルを使用するのは簡単

環境

ノード+ webpack4.0 +のWebPACK-CLI +スタイル・ローダーCSS-ローダー

ファイル構造

│   1。PNG 
│の   パッケージ。JSON 
│WebPACKの .configを。JS 
│ 
└─src 
    │アプリ。JS 
    │ 
    └─css 
            トンの.css

package.json（依存）

{
   " 名"：" ローダー"、
   " バージョン"：" 1.0.0 "、
   " 説明"："" 、
   " スクリプト"：{
     " テスト"：" エコー\"エラー：なしテスト指定\ "&& 1番出口" 
  }、
   " キーワード"：[]、
   " 著者"：""、
   " ライセンス"：" ISC "、
   " devDependencies "：{
     " CSS-ローダー"：" ^ 2.1.1 "、
     " スタイル・ローダー"：" ^ 0.23.1 "、
     " WebPACKの"：" ^ 4.33.0 "、
     「WebPACKの-CLI "：" ^ 3.3.3 " 
  } 
}

構成パッケージのWebPACK

ローダー順序は、スタイル-CSS-ローダーCSSのでなければならない
ファイル・ローダー

のurl-ローダー

CONSTパス= 必要とする（「パス」）。
モジュールの.exports = { 
    エントリ：{ 
        アプリ：' ./src/app.js ' 
    }、
    出力：{ 
        ファイル名：" bundle.js "、
        パス：パス。参加（path.resolve（__ dirnameは）、' DIST ' ）
    }、
    モード：" 開発"、
    モジュールを：{ 
        ルール：[ 
            { 
                テスト：/\.js$/、
                除外：' / node_modules / '、
            }、
            { 
                テスト：/\.css$/、
                 使用：[ " スタイルローダ"、" CSS-ローダ" ] 
            } 
        ] 
    } 
}。