Webpack：仅通过特定配置为 IE9 加载脚本答案

【问题标题】：Webpack: Loading scripts for IE9 only with specific configurationWebpack：仅通过特定配置为 IE9 加载脚本
【发布时间】：2015-06-12 15:09:08
【问题描述】：

我今天决定试用 webpack，但现在遇到了一个问题。

我们的应用程序与 api 对话。该 api 是可配置的，到目前为止，我一直在通过允许我的 gulpfile 的配置选项来做到这一点，这将确保使用正确的配置选项创建 config.js。

我可以用 webpack 做同样的事情，但我觉得我应该能够更漂亮地解决它。我研究了DefinePlugin。这部分解决了我的问题，因为我能够定义在构建 .js 文件中使用的属性。

但是，由于我使用的是跨浏览器请求，因此我也在 index.html 中加载 xdomain：

   <!--[if lte IE 9]>
    <script>
        var xdomainScript = document.createElement('script');

        xdomainScript.setAttribute('src','xdomain.js');
        xdomainScript.setAttribute('slave', config.apiUrl + '/proxy.html');

        document.head.appendChild(xdomainScript);
    </script>
    <![endif]-->

这就是问题的开始：definePlugin 插件只定义了在 built javascript 文件中使用的变量，而不是在 HTML 中。所以，我可以把这些东西移到一个 JS 文件中，但是我不知道如何使它只用 IE9，结合 webpack。

谁能赐教？

【问题讨论】：

Webpack html 插件为你生成 index.html 文件。也许这可能与自定义模板一起使用 github.com/ampedandwired/html-webpack-plugin
你可以在你的javascript文件中检测到IE版本：james.padolsey.com/javascript/…

标签： javascript webpack webpack-dev-server

【解决方案1】：

Webpack 允许您构建一些捆绑包。只需创建另一个具有更多依赖项的条目文件 - 专门用于 IE - 然后在您的条件 cmets 中使用它。

Webpack 配置：

entry: {
    'index': 'pages/index/index.js',
    'index-ie': 'pages/index/index.ie.js' //require('./index.js'); require('./ie-script.js');
},

您的页面：

<!--[if gt IE 9]>-->
<script src="index.js"></script>  
<!--<![endif]-->
<!--[if lte IE 9]>
<script src="index-ie.js"></script>
<![endif]-->

【讨论】：