didi / chameleon

🦎 一套代码运行多端,一端所见即多端所见
http://cml.didi.cn/
Apache License 2.0
9.02k stars 692 forks source link

微信小程序引入外部插件支持 #164

Closed TheLostlyp closed 5 years ago

TheLostlyp commented 5 years ago

目前cml框架是否支持微信小程序使用第三方插件呢? 微信小程序里需要使用第三方插件,如腾讯视频,则需要以下方式配置组件: "wx": { "usingComponents": { "txv-video": "plugin://tencentvideo/video" } } 然后编译就会报错

json [wx] errors: [41 (line), 19 (column)] component: [plugin://tencentvideo/video] is not found

beatles-chameleon commented 5 years ago

暂不支持usingComponents中写插件,下个版本进行支持,你可以先用下面的方式进行支持: 在chameleon.config.js中放入下面的代码,target中指向你要使用插件的json文件

cml.utils.plugin('webpackConfig', function({ type, media, webpackConfig }, cb) {
  if(type === 'wx') {
    webpackConfig.plugins.push({
      apply(compiler) {
        compiler.plugin('emit', function(compilation, callback) {
          let target = 'pages/index/index.json'; //改这里
          let obj = JSON.parse(compilation.assets[target]._value);
          obj.usingComponents['txv-video'] = 'plugin://tencentvideo/video';
          compilation.assets[target]._value = JSON.stringify(obj,'',4);
          return callback();

        })
      } 
    })
  }
  // cb函数用于设置修改后的配置
  cb({
    type,
    media,
    webpackConfig
  });
});