スクリプトタグ内のWebpack変更ファイル

私はReactJSとWebpackを初めて使いました。私は反応型定型文を使用しています。テンプレートを外部ライブラリの独自のセットを持つ定型文に追加しようとしています。スクリプトタグ内のWebpack変更ファイル

私が直面している問題は、これらの外部ライブラリにリンクするタグを追加しようとするたびに、webpackがこれらのファイルを再コンパイルしてコンテンツを変更することです。これはエラーを投げています。私はjquery.min.jsのソースをチェックすると

<!doctype html> 
<html lang="en"> 
<head> 
    <!-- The first thing in any HTML file should be the charset --> 
    <meta charset="utf-8"> 
    <!-- Make the page mobile compatible --> 
    <meta name="viewport" content="width=device-width, initial-scale=1"> 
    <!-- Allow installing the app to the homescreen --> 
    <link rel="manifest" href="manifest.json"> 
    <meta name="mobile-web-app-capable" content="yes"> 
    <title>Avalon</title> 
    <script type="text/javascript" src="resources/scripts/core/libraries/jquery.min.js"></script> 
</head> 
<body> 
    <!-- The app hooks into this div --> 
    <div id="app"></div> 
</body> 
</html>

は実行時に、その内容が変更されます。

設定で何を変更するのか、間違っているのか分かりません。

出典

2017-01-12 Akshay Singh

メインjsファイルに 'jquery'をインポートして、それをグローバルに必要とするなら' window'オブジェクトにアタッチしてみませんか？私はそれを考えていたjqueryのためにあなたのソース –

でライブラリをチェックするよりもはるかにクリーンですが、webpack –

webpackの出力で外部ライブラリをそのまま使用するには、external設定が役立ちます。

カスタムライブラリがどのように見えるかもしれませんが、

var jQuery = require("jquery"); 

function YourLib() {} 

// ... 

module.exports = YourLib;

は、その後、あなたのライブラリーを公開する設定は YourLibだろう

{ 
    output: { 
    // export itself to a global var 
    libraryTarget: "var", 
    // name of the global var: "YourLib" 
    library: "YourLib" 
}, 
    externals: { 
     // require("jquery") is external and available 
     // on the global var jQuery 
     "jquery": "jQuery" 
    } 
}

はこのWebPACKの出力でjqueryライブラリーが、カスタムライブラリは含まれませんでしょうバンドルに含めてくださいrequireのjQueryは、scriptタグとして含まれています。

出典

2017-01-12 06:23:48 Thaadikkaaran

でコンパイルせずにインポートする必要がある外部バンドルフォルダ全体があります。含まれるカスタムライブラリは、npmモジュールとして公開されていませんか？たとえば：外部でrequireを使用する代わりにファイルへのパスを与えることができますか？ –

スクリプトタグ内のWebpack変更ファイル

答えて

関連する問題