vue引入第三方zepto.js库报错

报错：

 TypeError: Cannot read property 'createElement' of undefined

• 首先介绍一下Zepto：
• 它是一个轻量化的，API类似jQuery的javascript类库。
• 它是一个面向移动端的类库，虽然能在桌面客户端运行，不过仅支持高级游览器（IE10+）。
• 它支持移动端“touch”有关的一些事件。
• ----全文地址请look：https://blog.csdn.net/wulex/article/details/79284877
• https://blog.csdn.net/xdongll/article/details/75504365

原因：

只使用了 AMD 规范的模块导出方法 define，没有用 CommonJs 规范的方法 module.exports 来导出模块，不过这不是造成报错的原因。

•  

解决办法： 
1、安装辅助插件库

• npm i -D script-loader exports-loader

2、webpack.config.js配置

// webpack.config {

     // ...

         module: {

                     loaders: [{

                                         test: require.resolve('zepto'),

                                          loader: 'exports-loader?window.Zepto!script-loader' }]

                        }

         }

3、就可以直接引用啦

// entry.js
import $ from 'zepto'

$(function () {
  // ...
})

4、如果需要全局使用，则可以配置

var webpackPlugins = [
    new webpack.ProvidePlugin({
      Vue: 'vue',
      nx: 'next-js-core2',
      $: 'zepto',
    }),
    new webpack.NoErrorsPlugin(),
    // split vendor js into its own file,
    new ExtractTextPlugin('[name]-[contenthash:5].css')
  ];

5、总结

由于我们用 npm 下载的模块没有模块化，因此我们要使用：

script-loader 全局上下文环境中执行模块 JS 文件；
exports-loader 添加 module.exports 来主动暴露需要的对象，使其模块化。
这样的方法适用于所有的库，不过最好的解决办法是从根本上让这些让这些库支持模块化。