gulp babel，出口没有定义 [英] gulp babel, exports is not defined

问题描述

考虑以下示例代码（或许我做错了？）

Consider the following example code (and maybe I am doing it wrong?)

 var FlareCurrency = {

 };

export {FlareCurrency};

我有以下任务：

gulp.task("compile:add-new-currency-minified", function(){
  return gulp.src('src/add-new-currency/**/*.js')
             .pipe(babel())
             .pipe(concat('Flare-AddNewCurrency.js'))
             .pipe(uglify({"preserveComments": "all"}))
             .pipe(gulp.dest('dist/minified/'));
});

当我运行这个我得到以下内容：

When I run this I get the following:

"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var FlareCurrency={};exports.FlareCurrency=FlareCurrency;

为了乐趣，我想在控制台中运行它，是的，我知道它什么都不做但是我没想到会看到这个：

For the fun of it, I wanted to run it in the console, yes I know it does nothing but I didn't expect to see this:

Uncaught ReferenceError: exports is not defined(…)

非最小化版本：

"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});
var FlareCurrency = {};

exports.FlareCurrency = FlareCurrency;

抛出相同的错误。 想法？

推荐答案

这实际上不是一个宝贝问题，你只是试图运行CommonJS代码（从ES6 导出中打印），无需准备。 CommonJS不在浏览器上运行，您需要使用工具将其打包成浏览器，例如 Webpack 或 Browserify 。

That is not actually a babel issue, you are just trying to run CommonJS code (transpiled from ES6 export) in the browser without preparation. CommonJS doesn't run on the browser, you need to use a tool to package it for the browser, such as Webpack or Browserify.

本周巧合，我在Github上创建了一个小项目，显示了Gulp + ES6代码的设置（使用 export ）+ Babel + Webpack： gulp-es6-webpack-example 。

Just by coincidence this week I created a small project on Github that shows a setup of Gulp + ES6 code (using export) + Babel + Webpack: gulp-es6-webpack-example.

在我的示例中，您可以同步（预加载）或异步（惰性加载）加载浏览器上的JS代码。

In my example you can load JS code on the browser either synchronously (pre-loaded) or asynchronously (lazy-loaded).

这篇关于gulp babel，出口没有定义的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！