Vue-cli3集成zepto

Vue-cli3集成zepto

由于许多朋友看到我之前的博客(Vue-cli集成zepto)，这篇博客是基于Vue-cli2配置的。现在大部分朋友使用的应该是Vue-cli3。所以有很多朋友加我QQ询问Vue-cli3怎么集成zepto.js 原理跟之前一样。这里放上之前博客链接：https://blog.csdn.net/wzyxdwll/article/details/79492705

怎么在Vue-cli3中引入Zepto?

vue-zepto(Vue-cli3 集成 zepto)

First Step(第一步)

安装 script-loader exports-loader
npm install script-loader exports-loader --save-dev

Second Step(第二步)

在根目录下新建 vue.config.js，把下面复制到你的配置文件中
create file named vue.config.js，then copy this to the file
// vue.config.js
module.exports = {
  chainWebpack: config => {
    config.module
      .rule('zepto')
      .test(require.resolve('zepto'))
      .use('exports')
      .loader('exports-loader?window.Zepto')
      .end()
      .use('script')
      .loader('script-loader')
      .end()
    //  if you want import zepto in the main.js you can not use this
    //  如果你想在main.js中引入zepto，下面的配置可以不用复制
    config
      .plugin('env')
      .use(require.resolve('webpack/lib/ProvidePlugin'), [{ $: 'zepto' }])
  }
}

Last Step(最后一步)

你可以在你的项目中使用zepto了
you can use zepto in your project

英语不好请大家见谅。附上我配置好的项目:

vue-cli3-zepto (github)

https://github.com/wzyxdwll/vue-cli3-zepto.git

再有疑问可咨询我QQ：1197983391