Question

gulpfile.js

import java.awt.BorderLayout;
import java.awt.Container;
import java.awt.datatransfer.Clipboard;
import java.awt.datatransfer.DataFlavor;
import java.awt.datatransfer.Transferable;
import java.awt.datatransfer.UnsupportedFlavorException;
import java.awt.event.InputEvent;
import java.io.IOException;

import javax.swing.JComponent;
import javax.swing.JFrame;
import javax.swing.JPanel;
import javax.swing.JTree;
import javax.swing.TransferHandler;
import javax.swing.TransferHandler.TransferSupport;
import javax.swing.tree.DefaultMutableTreeNode;
import javax.swing.tree.DefaultTreeModel;
import javax.swing.tree.TreeModel;
import javax.swing.tree.TreeNode;
import javax.swing.tree.TreePath;

class Element {
  private String id;
  public Element(String id) {
    this.id = id;    
  }

  public String toString() {
    return "A";
  }

  public String getId() {
    return id;
  }
}

class CustomTransferHandler extends TransferHandler {
  @Override
  protected Transferable createTransferable(JComponent c) {
    JTree tree = (JTree)c;
    TreePath[] paths = tree.getSelectionPaths();
    Transferable t = null;
      DataFlavor DF = new DataFlavor(DataFlavor.javaJVMLocalObjectMimeType, Element.class.getName()); 
      t = new Transferable() {

        @Override
        public DataFlavor[] getTransferDataFlavors() {
          return new DataFlavor[]{DF};
        }

        @Override
        public boolean isDataFlavorSupported(DataFlavor flavor) {
          return flavor.equals(DF);
        }

        @Override
        public Object getTransferData(DataFlavor flavor) throws UnsupportedFlavorException, IOException {
          if (!flavor.equals(DF)) {
            return null;
          }
          Element[] els = new Element[paths.length];
          int idx = 0;
          for (TreePath path : paths) {
            Object el = path.getLastPathComponent();
            els[idx++] = (Element)((DefaultMutableTreeNode)el).getUserObject();
          }
          return els;
        }          
      };
    return t;        
  }  

  @Override
  public int getSourceActions(JComponent c) {
    return COPY;
  }
}

public class DnDTest {
  public static void main(String args[]) {
    JFrame f = new JFrame("Test");
    f.setSize(640, 400);
    Container c = f.getContentPane();
    c.setLayout(new BorderLayout());
    JTree t = new JTree();
    t.setTransferHandler(new CustomTransferHandler());

    t.setDragEnabled(true);
    DefaultMutableTreeNode root = new DefaultMutableTreeNode(new Element("root"));
    root.add(new DefaultMutableTreeNode(new Element("child")));
    t.setModel(new DefaultTreeModel(root));
    c.add(t, BorderLayout.WEST);
    JPanel p = new JPanel();
    c.add(p, BorderLayout.CENTER);
    p.setTransferHandler(new TransferHandler("entity") {
      @Override
      public boolean canImport(TransferSupport support) {
        return true;
      }
      @Override
      public boolean importData(TransferHandler.TransferSupport support) {
        Transferable t = support.getTransferable();
        DataFlavor[] fv = t.getTransferDataFlavors();
        Element[] els;
        try {
          for (DataFlavor f: fv) {
            try {
              els = (Element[])t.getTransferData(f);
              for (Element el : els) {
                System.out.println(el.getId());
              }
            }catch(RuntimeException ex) {
              ex.printStackTrace();
            }
          }
        } catch (UnsupportedFlavorException | IOException e) {
          return false;
        }
        return true;
      }
    });
    f.setVisible(true);
  }
}

.babelrc

gulp.task('es6', function() {
    gulp.src('libs/es6/*.js')
    .pipe(babel())
    .pipe(gulp.dest('libs/js'))
        .pipe(concat('all.js'))
        .pipe(gulp.dest('libs/dist'))
        .pipe(rename('all.min.js'))
        .pipe(uglify())
        .pipe(gulp.dest('libs/dist'));
});

使用gulp-babel变换es6到es5然后得到错误：未捕获的ReferenceError：未定义require。我试着配置.babelrc

{
  "presets": ["es2015"]
}

但仍然收到错误 define未定义。那么如何使es6变换es5在浏览器中能正常？

Answer 1

尝试将.babelrc文件更改回：

{
  "presets": ["es2015"]
}

现在将你的gulpfile.js改为：

gulp.task('es6', function() {
    gulp.src('libs/es6/*.js')
    .pipe(babel({
        plugins: 'babel-plugin-transform-es2015-modules-amd'
    }))
    .pipe(gulp.dest('libs/js'))
        .pipe(concat('all.js'))
        .pipe(gulp.dest('libs/dist'))
        .pipe(rename('all.min.js'))
        .pipe(uglify())
        .pipe(gulp.dest('libs/dist'));
});

我遇到了类似的问题，这对我有用。唯一的区别是我的插件名为＆＃34; transform-es2015-modules-amd＆＃34;。

gulp-babel将es6改为es5 require并不是未定义的

1 个答案: