How to use babel - 10 common examples

transform: function (content, filename) {

            // Make sure to only transform your code or the dependencies you want
            if (filename.indexOf('lib') >= 0) {
                var result = Babel.transform(content, {
                    sourceMap: 'inline',
                    filename: filename,
                    sourceFileName: filename
                });
                return result.code;
            }

            return content;
        }
    }

render() {

    const inputClasses = Helper.classnames([this.props.className,'photo-input','form-group',{
      'required': this.props.required,
      'has-error': !this.state.isValid
    }]);

    const uploaderClasses = Helper.classnames([this.props.className,'drag-area','uploader','alert',{
      'alert-default': !this.state.dragging,
      'alert-info': this.state.dragging
    }]);

    const cameraCapture = function cameraCapture() {
      if (/iP(hone|od|ad)/.test(navigator.platform)) {
        // supports iOS 2.0 and later: 
        const v = (navigator.appVersion).match(/OS (\d+)_(\d+)_?(\d+)?/);
        const vArray = [parseInt(v[1], 10), parseInt(v[2], 10), parseInt(v[3] || 0, 10)];

        if (vArray[0] < 10) {

function transpile(src, stack) {
  var target = createTargetName(src);

  babel.transformFile(src, babelOptions, function (err, result) {
    if (err) { return console.log(err.codeFrame); }

    fse.outputFile(target, result.code, function(err) {
      if (err) { return console.error(err.message); }

      console.log(util.format(green + '=> "%s" successfully transpiled to "%s"' + NC, src, target));

      // next
      if (stack && stack.length) {
        transpile(stack.shift(), stack);
      }
    });
  });
}

filename: event.path,
      sourceMap: true,
      moduleIds: true
    }

    if (opts.modules === 'amd') {
      var modulePath = event.projectPath.replace(/\.js$/, '')
      if (opts.getModulePath)
        modulePath = opts.getModulePath(modulePath)
      babelOpts.moduleId = modulePath
    }

    // if (event.basePath)
    //   babelOpts.filenameRelative = event.basePath

    var result = babel.transform(event.data, babelOpts)
    return _.pick(result, 'code', 'map')
  }
}

Portal.prototype.saveApp = function (options) {
  const dfd = new Deferred();
  const appState = lang.getObject('items.app',false,AppStore.getState());
  const defaults = appState;
  const settings = $.extend(true, {}, defaults, options);

  const username = this.getPortalUser().username;
  const baseRequestPath = this.portalUrl.stripTrailingSlash() + '/content/users/' + (settings.item.owner ? settings.item.owner : username) + (settings.item.ownerFolder ? ('/' + settings.item.ownerFolder) : '');

  // Remove properties that don't have to be committed
  delete settings.item.avgRating;
	delete settings.item.modified;
	delete settings.item.numComments;
	delete settings.item.numRatings;
	delete settings.item.numViews;
	delete settings.item.size;
  delete settings.item.serviceProxyParams;

  // TODO add serviceproxyparams

}).then((res) => {
      if (res.id && res.id === settings.id) {
        response.item = res;
        if (settings.deferredResponseOnly) {
          deferred.resolve(response);
        } else if (settings.item === 'app' && response.data.values.settings) {
          crowdsourceVersionUpdate(response);
        } else if (settings.item === 'app') {
          ArcgisActions.receiveScratchCreationAppItem(response);
        } else if (settings.item === 'webmap') {
          if (lang.getObject('mode.fromScratch',false,AppStore.getState()) && lang.getObject('app.portal.user.username',false,AppStore.getState()) !== res.owner) {
            // If owned by another user, remove id information so app will create a copy of the original webmap in author's content
            $.extend(true,response.item,{
              id: '',
              extent: res.extent.toString(),
              orgId: '',
              owner: '',
              ownerFolder: ''
            });
            ArcgisActions.receiveWebmapItem(response);
            displayDifferentWebmapOwnerMessage();
          } else {
            $.extend(true,response.item,{
              extent: res.extent.toString()
            });
            ArcgisActions.receiveWebmapItem(response);
          }

{...this.props.components.shareDisplay}
                {...this.props.components.map.crowdsourceLayer}>
               : null }
            
          
        );

        return sidePanel;
      default:
        // Translation Strings
        const CHANGE_VIEW_TO_GALLERY = viewerText.layouts.stacked.changeView.galleryView;
        const CHANGE_VIEW_TO_MAP = viewerText.layouts.stacked.changeView.mapView;

        // Icons
        const downArrowHtml = {
          __html: getIcon('arrow-down-open')
        };
        const upArrowHtml = {
          __html: getIcon('arrow-up-open')
        };

        const stacked = (
          <div>
            <div>
              <div>
                
                <div>
                  <span>{CHANGE_VIEW_TO_GALLERY}</span>
                  <span></span>
                </div>
              </div>
              <div></div></div></div>

import $ from 'jquery';
import AppStore from 'babel/store/AppStore';
import lang from 'dojo/_base/lang';
import URI from 'lib/urijs/src/URI';
import OAuthInfo from 'esri/arcgis/OAuthInfo';
import IdentityManager from 'esri/IdentityManager';
import UserActions from 'babel/actions/UserActions';
import AppActions from 'babel/actions/AppActions';
import ArcgisItem from 'babel/utils/arcgis/items/Item';
import Logger from 'babel/utils/logging/Logger';
import viewerText from 'i18n!translations/viewer/nls/template';
import 'babel/utils/helper/strings/StringUtils';

const _logger = new Logger({source: 'User Controller'});

// const _onError = function onError(error) {
//   _logger.logMessage({
//     type: 'error',
//     error
//   });
// };

const _onStatus = function onStatus(message,debugOnly) {
  _logger.logMessage({
    type: 'status',
    debugOnly,
    message
  });
};

import $ from 'jquery';
import React from 'react'; // eslint-disable-line no-unused-vars
import Helper from 'babel/utils/helper/Helper';
import FormGroup from 'babel/components/forms/base/FormGroup';
import Logger from 'babel/utils/logging/Logger';
import IconTooltip from 'babel/components/helper/tooltip/IconTooltip';
import ViewerText from 'i18n!translations/viewer/nls/template';

const formText = ViewerText.forms.select;

const _logger = new Logger({
  source: 'Select'
});

const _onError = function onError(err) {
  _logger.logMessage({
    type: 'error',
    error: err
  });
};

export default class Select extends FormGroup {

  constructor(props) {
    super(props);
  }

import $ from 'jquery';
import AppStore from 'babel/store/AppStore';
import lang from 'dojo/_base/lang';
import esriRequest from 'esri/request';
import Logger from 'babel/utils/logging/Logger';
import ReviewActions from 'babel/actions/ReviewActions';
import 'babel/utils/helper/strings/StringUtils';

const _logger = new Logger({source: 'Contribute Controller'});

const _onError = function onError(error) {
  _logger.logMessage({
    type: 'error',
    error
  });
};

export default class CrowdsourceReviewController {

  constructor() {

    // Autobind methods
    this.updateAppState = this.updateAppState.bind(this);
    this.editReviewedFeatures = this.editReviewedFeatures.bind(this);