Browserify 需要 imperavi 编辑器

Posted 2023-03-03

【中文标题】Browserify 需要 imperavi 编辑器

【英文标题】：Browserify require imperavi redactor

【发布时间】：2015-12-13 00:11:03

【问题描述】：

我想在我的 browserify 构建中需要 imperavi's redactor (npm package) 的代码。但是我得到了一个不可预知的错误。

这是react元素的代码

React = require('react')
ReactBootstrap = require('react-bootstrap')

Input = ReactBootstrap.Input
Button = ReactBootstrap.Button

require('bower-redactor/redactor/redactor-plugins/table.js')
require('bower-redactor/redactor/redactor.js')
require('bower-redactor/redactor/langs/ru.js')

module.exports = React.createClass
  componentDidMount: ->
    jQuery('textarea.redactor').redactor
      lang: 'ru'
      plugins: ['table']
  render: ->
    <form>
      ...
      <Input type='textarea' ref='content' className='redactor' defaultValue=@props.content />
      ...
    </form>

一切顺利，直到我 require('bower-redactor/redactor/redactor-plugins/table.js') 并将 plugins: ['table'] 添加到代码中。我收到一个错误：ReferenceError: RedactorPlugins is not definedredactor.js#L1430

但是它们是在table.js定义的，在redactor.js之前是必需的，为什么会出现这个错误。如何避免它并开始成功使用 redactor.js？

我尝试了很多东西：browserify-shim package，制作global.RedactorPlugins = 等等，但都没有成功。

【参考方案1】：

您需要将代码包含在您的捆绑包中。它将是全球性的，因此您只需引用它即可。要求不起作用。使用 gulp 它看起来像这样；

    var source = 
        libjs: ['bower-redactor/redactor/redactor-plugins/table.js', 'bower-redactor/redactor/redactor.js', 'bower-redactor/redactor/langs/ru.js']
    ;

    gulp.task('libjs', function () 
        gulp.src(source.libjs)
            .pipe(concat('lib.min.js'))
            .pipe(gulp.dest('./ui-dist'))
    );