Grunt-webpack-globals 通过 ProvidePlugin答案

【问题标题】：Grunt-webpack-globals via ProvidePluginGrunt-webpack-globals 通过 ProvidePlugin
【发布时间】：2014-08-10 06:25:46
【问题描述】：

我一直在尝试为我的 webpack 编译模块提供 grunt。我的所有文件至少需要 1 或 2 个全局变量（React、Backbone 和下划线）。

这些资产会被编译成 js，react 视图。我想知道如何使用 ProvidePlugin 为我的所有模块提供一些基础包，包括 webpack 和/或 grunt 配置？

我不知道这段代码会在哪里存在！ Gruntfile.js？入口js文件？

plugins: [
  webpack.ProvidePlugin({
    "_": "underscore"
  })
]

或

new webpack.ProvidePlugin({
  $: "jquery"
})

我研究并发现这是最接近的： Webpack ProvidePlugin vs externals?

非常感谢您的帮助！

【问题讨论】：

只是为了澄清，当我把它放在我的入口 js 文件 (app.js) 中时，我得到“找不到 webpack”。

标签： javascript gruntjs webpack

【解决方案1】：

想通了！最后 grunt webpack 配置采用相同的选项吗？看起来像:)

grunt.initConfig({
    pkg: pkgConfig,
    loyalty: loyaltyConfig,
    webpack: {
        development: {
            // resolve: {
            //     modulesDirectories: [ 'vendors' ]
            // },
            amd: {
                $: true
            },
            plugins: [
                new webpack.ProvidePlugin({
                    $: 'jquery',
                    _: 'underscore',
                    React: 'react/addons',
                    config: 'json!../../config.json'
                })
            ],

当且仅当它们被明显使用时，这将包括所需的元素。

【讨论】：