6to5 modules

[melky]

как будет выглядеть импорт модуля на ES6?

var React = require('react/addons');
var cx = React.addons.classSet;
var PureRenderMixin = require('react').addons.PureRenderMixin;

var Fluxxor = require('fluxxor');
var FluxMixin = Fluxxor.FluxMixin(React);
var StoreWatchMixin = Fluxxor.StoreWatchMixin;

var Router = require('react-router');
var State = Router.State;
var Navigation = Router.Navigation;

подозреваю, что некоторые будут так:

import React from 'react/addons'
// cx ???
// PureRenderMixin  ???

import Fluxxor, {StoreWatchMixin} from 'fluxxor'
// FluxMixin  ???

import Router, {State, Navigation} from 'react-router'

интересуют конкретно импорты, без var\let. хотя с ними будет вот так:

import React from 'react/addons'
let cx = React.addons.classSet
let PureRenderMixin = React.addons.PureRenderMixin

import Fluxxor, {StoreWatchMixin} from 'fluxxor'
let FluxMixin = Fluxxor.FluxMixin(React)

import Router, {State, Navigation} from 'react-router'

[cyber]

Что за фигня, не фига не пойму. Юзаю gulp-webpack

gulp.task ( "webpack", function ( ) {

    return gulp.src('dist/*.js')
        .pipe(webpack( {} ))
        .pipe(gulp.dest('dist/'));
} );



gulp.task('default', [ "webpack" ] , function() {});

Но получаю хрень

ERROR in multi main
Module not found: Error: Cannot resolve 'file' or 'directory' /home/cyber_ua/Dropbox/Projects/cropperJS/dist/crop.js in /home/cyber_ua/Dropbox/Projects/cropperJS
@ multi main

Что за бред почему оно ищет в деректории выше?
Это правильный путь

/home/cyber_ua/Dropbox/Projects/cropperJS/dist/crop.js

[melky]

cyber, совсем не понял, что ты делаешь и что хочешь получить на выходе

[cyber]

melky, У меня есть gulp + gulp-webpack + babel
Хочу что сначало код привело к es5 через babel, а потом собрались модули которые подключены через require

[melky]

melky, У меня есть gulp + gulp-webpack + babel
Хочу что сначало код привело к es5 через babel, а потом собрались модули которые подключены через require

хм.. можешь скинуть пример файла и конфиг?

[cyber]

Вот

gulp.task( "babel", function ( ) {
    return gulp.src( "src/*.js" )
        .pipe( babel() )
        .pipe( gulp.dest("dist/") )
        .pipe(webpack( {} ));
});


gulp.task( 'watch', function() {
    gulp.watch( "src/*.js", [ "babel", "webpack"  ] );
});

gulp.task ( "webpack", function ( ) {

    return gulp.src('dist/*.js')
        .pipe(webpack( {} ))
        .pipe(gulp.dest('dist/'));
} );



gulp.task('default', [ "watch", "babel", "webpack" ] , function() {});

[melky]

gulp.task( "babel", function ( ) {
    return gulp.src( "src/*.js" )
        .pipe( babel() )
        .pipe( gulp.dest("dist/") )
        .pipe(webpack( {} ));
});


gulp.task( 'watch', function() {
    gulp.watch( "src/*.js", [ "babel", "webpack"  ] );
});

gulp.task ( "webpack", function ( ) {

    return gulp.src('dist/*.js')
        .pipe(webpack( {} ))
        .pipe(gulp.dest('dist/'));
} );



gulp.task('default', [ "watch", "babel", "webpack" ] , function() {});

entry должен быть один. babel должен быть внутри webpack
http://webpack.github.io/docs/usage-with-gulp.html
https://github.com/babel/babel-loader

[cyber]

melky, Спасибо сенсей

[nerv_]

Не спеши, разложи в голове по полочкам.

времени на тот момент не было

[cyber]

melky, заработало только так

gulp.task( 'build', function() {
    return gulp.src( "src/*.js" )
        .pipe( babel() )
        .pipe( gulp.dest("dist/") )
        .pipe(webpack( {
            module: {
                //babel: [
                //    { test: /\.js$/, exclude: /node_modules/, loader: 'babel' }
                //]
        }} ))
        .pipe( gulp.dest("dist/") );
});

Если прописать модуль то не пашит..