webpack-contrib/expose-loader

can not export vuex with webpack config

Val-istar-Guo opened this issue · 4 comments

Val-istar-Guo commented
  • Operating System: Mac
  • Node Version: 10.0.0
  • NPM Version: 5.6.0
  • webpack Version: 4.5.0
  • expose-loader Version: 0.7.5

This issue is for a:

  • bug export-loader not work with vuex

Code

when i import 'vuex' and import 'jquery' window.vuex is not defined, but window.$ can be use correct

when i use import 'expose-loader?vuex!vuex', window.vuex can be use.

      // webpack loader config
      {
        test: require.resolve('vuex'),
        use: [{
          loader: 'expose-loader',
          options: 'vuex'
        }]
      },
      {
        test: require.resolve('jquery'),
        use: [{
           loader: 'expose-loader',
           options: 'jQuery'
        },{
           loader: 'expose-loader',
           options: '$'
        }]
      },
CLI Command
  # paste the CLI command you're using. if this isn't applicable, it's safe to remove.
  $ {the command}
webpack.config.js

https://github.com/Val-istar-Guo/assist/blob/dad23f08212c818b4fd210036a656cd77a02b149/build/webpack.config.common.js#L26-L52

https://github.com/Val-istar-Guo/assist/blob/dad23f08212c818b4fd210036a656cd77a02b149/client/store/index.js#L6-L7

Expected Behavior

window.vuex can be use, when import vuex and use webpack config。

Actual Behavior

can not find vuex, unless import 'expose-loader?vuex!vuex'

Runtu4378 commented

where you call window.vuex?

Runtu4378 commented

下载了你的项目来看，不过暂时看不懂：

  • 怎么利用 jsonp 来引用产物
  • vuex 的 expose 暴露操作好像没有在现在的 master 分支上

我已有的经验里面比较好的解决方案是：

利用 webpack.ProvidePlugin 向 webpack 打包运行时注入需要注入的环境变量的同时利用 expose-loader （在 rules 里面注入不太好使）向浏览器脚本运行时注入要暴露的变量（这个变量要在这个 entry 文件开始运行时才会生效，在此之前的 script 注入中这个变量无效）例子详见：

https://github.com/Runtu4378/webpack_jquery_ie8/blob/77f9e3bdc477012cdc9677b42a08b4ebc86c40c2/cli/wpConf/public/plugins.js#L51

    // 注册jquery全局变量
    new webpack.ProvidePlugin({
      '$': 'expose-loader?$!expose-loader?jQuery!jquery',
      'jQuery': 'expose-loader?$!expose-loader?jQuery!jquery',
      'window.jQuery': 'expose-loader?$!expose-loader?jQuery!jquery',
      'window.$': 'expose-loader?$!expose-loader?jQuery!jquery',
    }),

因为同时用到了 dll 和 ProvidePlugin 和 expose-loader 所以可能会有点复杂，也不一定对你适用，你先试试

i downloaded your project and try to run it，buy i can`t figure out：

  • how does the product file loaded via jsonp
  • it seem had no config of expose vuex on now master branch

according to my experience, the better solution is:

use webpack.ProvidePlugin to expose global environment vars to the build runtime of webpack, as the same time use expose-loader (use in rules often not effect)to expose global environment vars to the bowser`s runtime(these vars will only active when the entry file start load) look at this:

https://github.com/Runtu4378/webpack_jquery_ie8/blob/77f9e3bdc477012cdc9677b42a08b4ebc86c40c2/cli/wpConf/public/plugins.js#L51

    // 注册jquery全局变量
    new webpack.ProvidePlugin({
      '$': 'expose-loader?$!expose-loader?jQuery!jquery',
      'jQuery': 'expose-loader?$!expose-loader?jQuery!jquery',
      'window.jQuery': 'expose-loader?$!expose-loader?jQuery!jquery',
      'window.$': 'expose-loader?$!expose-loader?jQuery!jquery',
    }),
Val-istar-Guo commented

很抱歉，项目还在开发阶段，没有整理文档，思路也不是特别清晰。谢谢你的方案，不过我并不介意使用import 'expose-loader?vuex!vuex'这种方式。

我比较疑惑的地方在于按照expose-loader的说明文档，在rules里面配置和使用import 'expose-loader?vuex!vuex'应该会产生相同的效果，但是事实却并非如此。

如果这并非expost-loader的bug，我想可以关闭这个问题。
如果这是一个可能存在的bug，那么可能需要等项目稳定下来，我才能贴出具体的复现方案。

非常感谢您的帮助。

I'm sorry that the project is still in the development stage, and the documents have not been sorted out, and the ideas are not very clear. Thanks for the plan, but I don't mind using import 'expose - loader? Vuex! Vuex ' this way.

I was wondering is according to expose-loader documentation, in configuration rules and use import 'expose - loader? Vuex! Vuex ' should produce the same effect, but the fact is not.

If this is not a expost-loader bugs, I think you can turn off this problem.

If this is a possible bug, I may need to wait for the project to stabilize before I can post a specific recurring plan.

Thank you very much for your help.

  • 👍1