Webpack.ProvidePlugin with zepto

Question

I have a project that uses zepto in a lot of modules. As you know, webpack.ProvidePlugin is the best way to handle this scenario, with it I do not need to manually import zepto into each module.

zepto does not export itself, so I cannot import it using ProvidePlugin.

 plugins: [
    new webpack.ProvidePlugin({
      $: 'zepto'
    })
  ]

I know there is a zepto wrap called webpack-zepto .

But if I make this decision, every time I upgrade zepto, I need to update the code myself.

Is there any way to solve my problem?

Answer 1

You can try script-loader:

webpack.config.js

loaders: [
    {
        test: require.resolve('zepto/zepto.min.js'),
        loader: 'script'
    }
]
plugins: [
    new webpack.ProvidePlugin({
        $: 'zepto/zepto.min.js'
    })
]

zepto.min.js , script, zepto window.$

UPDATE:

$ window.$, zepto.min.js exports-loader script-loader:

webpack.config.js

loaders: [
    {
        test: require.resolve('zepto/zepto.min.js'),
        loader: 'exports?window.$!script'
    }
]
plugins: [
    new webpack.ProvidePlugin({
        $: 'zepto/zepto.min.js'
    })
]