zoukankan      html  css  js  c++  java
  • 百度UEditor -- ZeroClipboard is not defined

    项目中一直在使用UEditor,风平浪静。

    近期该项目引入了Requirejs,结果发现在有富文本编辑器的页面都会在控制台报出如下异常:

    Uncaught ReferenceError: ZeroClipboard is not defined ueditor.all.min.js:265

    经查看代码后发现 ueditor.../third-party/zeroclipboard/ZeroClipboard.js中 输出方法的地方是酱紫的

    1
    2
    3
    4
    5
    6
    7
    8
    9
    if (typeof define === "function" && define.amd) {
        define(function() {
          return ZeroClipboard;
        });
      } else if (typeof module === "object" && module && typeof module.exports === "object" && module.exports) {
        module.exports = ZeroClipboard;
      } else {
        window.ZeroClipboard = ZeroClipboard;
      }

    意思就是说

    • 如果当前页面的模块加载模式是AMD的 则定义模块
    • 如果是CommonJs的,则输出到模块 ZeroClipboard
    • 否则 把  ZeroClipboard 定义为全局变量

    这样 解决方案就有两种。

    ①不适用模块加载模式来使用这个功能

    这样方法需要修改一点源码,把上面这段代码替换成如下代码即可

    1
    2
    3
    4
    5
    6
    7
    8
    if (typeof define === "function" && define.amd) {
        define(function() {
          return ZeroClipboard;
        });
      } else if (typeof module === "object" && module && typeof module.exports === "object" && module.exports) {
        module.exports = ZeroClipboard;
      }
      window.ZeroClipboard = ZeroClipboard;

    ②如果不修改源码,就得在模块加载时做处理了

    首先是修改配置

    1
    2
    3
    4
    5
    6
    require.config({
        baseUrl: '',
        paths: {
            ZeroClipboard: "./UEditor.../ZeroClipboard"//主要是加这句话
        }
    });

     然后是在调用这个模块并把模块定义到全局变量

    1
    2
    3
    require(['ZeroClipboard'], function (ZeroClipboard) {
        window['ZeroClipboard'] = ZeroClipboard;
    });
  • 相关阅读:
    搭建博客
    开发常用的工具函数
    堆内存和栈内存及C++内存分配
    nuxt本机运行,如何用ip访问,localhost也可以访问?
    vue封装一个左滑删除的组件
    vue封装一个swiper组件
    YAPI安装google的cross-request插件
    vue项目中如何封装api,使请求方法清晰,适合协作开发
    axios封装一个请求本地数据的方法
    nuxt中vuex如何模块化分
  • 原文地址:https://www.cnblogs.com/Ting-log/p/9105488.html
Copyright © 2011-2022 走看看