如何运行由webpack转换的函数？
我有一个简单的库，我正在与ES6，我有一些require关键字，然后，我需要将其转换为浏览器了解它的版本， 我使用webpack使我的图书馆的浏览器版本。
这里是一个例子：
main.js
import Test from './test'; function callMe(){ console.log("I am damn called!"); } test.js
export default function(string) { console.log("This is awesome!"); [1,2,3].map(n => n + 1); }
gulpfile.js（我使用Gulp）
var gulp = require('gulp'); var babel = require('gulp-babel'); gulp.task('babel', () => { return gulp.src('src/*.js') .pipe(babel({ presets: ['es2015'] })) .pipe(gulp.dest('dist/babel')); }); var webpack = require('gulp-webpack'); gulp.task('webpack', function() { return gulp.src('dist/babel/main.js') .pipe(webpack()) .pipe(gulp.dest('dist/')); });
现在当我运行Gulp任务（ babel和webpack ）时，我将得到一个是webpack结果的webpack （并且意味着所有需要和导入都被转换）
这是webpack的结果（我的意思是转换结果） ：
/******/ (function(modules) { // webpackBootstrap /******/ // The module cache /******/ var installedModules = {}; /******/ // The require function /******/ function __webpack_require__(moduleId) { /******/ // Check if module is in cache /******/ if(installedModules[moduleId]) /******/ return installedModules[moduleId].exports; /******/ // Create a new module (and put it into the cache) /******/ var module = installedModules[moduleId] = { /******/ exports: {}, /******/ id: moduleId, /******/ loaded: false /******/ }; /******/ // Execute the module function /******/ modules[moduleId].call(module.exports, module, module.exports, __webpack_require__); /******/ // Flag the module as loaded /******/ module.loaded = true; /******/ // Return the exports of the module /******/ return module.exports; /******/ } /******/ // expose the modules object (__webpack_modules__) /******/ __webpack_require__.m = modules; /******/ // expose the module cache /******/ __webpack_require__.c = installedModules; /******/ // __webpack_public_path__ /******/ __webpack_require__.p = ""; /******/ // Load entry module and return exports /******/ return __webpack_require__(0); /******/ }) /************************************************************************/ /******/ ([ /* 0 */ /***/ function(module, exports, __webpack_require__) { "use strict"; var _test = __webpack_require__(1); var _test2 = _interopRequireDefault(_test); function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; } function callMe() { console.log("I am damn called!"); } /***/ }, /* 1 */ /***/ function(module, exports) { "use strict"; Object.defineProperty(exports, "__esModule", { value: true }); exports.default = function (string) { console.log("This is awesome!"); [1, 2, 3].map(function (n) { return n + 1; }); }; /***/ } /******/ ]);
第一个问题是，现在怎样才能执行（并访问）在callMe中定义并现在被webpack捆绑的callMe函数 ？
另一个问题是，代码看起来很丑，不简单，有什么办法可以简化它吗？
而且我也认为webpack似乎是别的东西，只是为了将需求转换成浏览器可支持的版本，并且browserify与Gulp有问题。 任何build议？
我如何执行（并访问）在
callMe中定义的callMe函数？
你不能，因为你没有出口。 你应该改变你的代码，如下所示：
import Test from './test'; export default function callMe(){ console.log("I am damn called!"); }
那么你可以像这样导入它：
import callMe from 'dist/main.js'; callMe(); // logs "I am damn called!"
代码看起来丑陋而不简单，有什么办法可以简化它吗？
没有必要简化它。 捆绑的代码看起来很丑，没有什么问题，因为无论如何它不会被人类读取。
由于search如何使用webpack公开function带我到这里，答案是隐藏在评论中，我会在这里发布它更加明显。
当我的webpack-bundeled脚本被加载时，我想callMe()函数在全局（窗口）对象上可见。 在我的情况下，我想调用我的Angular2应用程序的一个button单击，但这只是实现的细节delyed bootstrap。
所以在main.js我导出我的function：
export function callMe(){ console.log("I am damn called!"); // And I do more things ;) }
而根据webpack文档 ，在webpack.jsconfiguration我做：
module.exports = { entry { app: "dist/babel/main.js" }, output { // My funky output configs... libraryTarget: "this" } }
而已。 this是指在我的html页面中使用<script>标签加载的全局窗口对象。
对不起OP，我不知道Gulp-webpack的configuration。 但是我可能只是按照gulp-webpack文档将上述对象传递给webpack()函数。