Javascript-форум (https://javascript.ru/forum/)
-   Сборка проекта, утилиты (https://javascript.ru/forum/server-tools/)
-   -   ES6 модули и Webpack (https://javascript.ru/forum/server-tools/64165-es6-moduli-i-webpack.html)

lakusha 23.07.2016 19:10

ES6 модули и Webpack
 
Мне нужно использовать ES6 модули для приложения на React+Flux.
Как я понял - для того чтобы их использовать нужен Webpack, я вроде как настроил его, и даже что-то работает.

например:

welcome.js

"use strict";
export default function (message) {
	console.log("Welcome ${message}");
};

и
home.js

"use strict";
import welcome from './welcome';
welcome("home");


адекватно взаимодействуют, и выводят то что нужно.

но как только я пытаюсь подключить любой модуль, загруженный через npm:

home.js

import request  from 'request';



у меня при попытке сборки начинается ад в командной строке типа такого:



Подскажите плз, как правильно использовать ES6 модули а то меня уже плавит.
package.json

{
  "name": "gitter-demo-app",
  "version": "0.0.1",
  "dependencies": {
    "babel-runtime": "^6.9.2",
    "express": "~3.4.4",
    "jade": "~0.35.0",
    "passport": "~0.2.0",
    "passport-oauth2": "~1.1.1",
    "request": "~2.27.0"
  },
  "devDependencies": {
    "babel-plugin-transform-runtime": "^6.9.0",
    "mocha": "",
    "nodemon": "~1.0.15",
    "webpack": "^1.13.1"
  },
  "scripts": {
    "start": "node app.js",
    "pretest": "make restart-test-server",
    "test": "NODE_ENV=test mocha",
    "posttest": "make stop-test-server"
  }
}



webpack.config.js

const webpack = require('webpack');

module.exports = {
	entry : "./home",            
	output : {
		filename : "build.js"	 
	},

	watch : true ,               

	watchOptions : {
		aggregateTimeout : 100   
	},

	devtool : "source-map",      

	module : {
		loaders: [{
		    test: /\.js$/,
		    exclude: /(node_modules|bower_components)/,				
		    loader: 'babel',									//babel
		    query: {
		      presets: ['es2015'],
		      plugins: ['transform-runtime']
		    }
		}]
	},
};

Vlasenko Fedor 23.07.2016 19:26

lakusha,
разве модули написаны в ES6
используй
var request  = require('request');

lakusha 23.07.2016 19:32

Poznakomlus,
https://learn.javascript.ru/modules - вот эти модули мне нужны, как их юзать со всякими npm штуками?

через
var request = require('request');
та же шляпа в терминале.

Babel же переводит все import/export в require, если я это делаю вместо бабеля - ничего не меняется :(

destus 23.07.2016 19:58

lakusha,
в package.json добавь
{
  "browser": {
    "net": false,
    "tls": false
  }
}

lakusha 23.07.2016 20:06

destus,

package.json
{
  "name": "gitter-demo-app",
  "version": "0.0.1",
  "dependencies": {
    "babel-runtime": "^6.9.2",
    "express": "~3.4.4",
    "jade": "~0.35.0",
    "passport": "~0.2.0",
    "passport-oauth2": "~1.1.1",
    "request": "~2.27.0"
  },
  "devDependencies": {
    "babel-plugin-transform-runtime": "^6.9.0",
    "mocha": "",
    "nodemon": "~1.0.15",
    "webpack": "^1.13.1"
  },
  "scripts": {
    "start": "node app.js",
    "pretest": "make restart-test-server",
    "test": "NODE_ENV=test mocha",
    "posttest": "make stop-test-server"
  },
  "browser": {
    "tls": false
  }
}





Не помогло :(

destus 23.07.2016 20:16

lakusha,
хм, а тут пишут что помогло. Ну можно ещё через конфиг самого вебпака. Попробуй https://github.com/webpack/react-starter/issues/3

lakusha 23.07.2016 20:32

destus,
Порыл в сети еще, нашел чуть более расширенную штуку ( больше параметров)

node: {
      net: "empty",
      tls: "empty",
      fs : "empty",
      console : "empty"
    }


Ну, некий прогресс есть - ошибок стало меньше, но они остались)


lakusha 23.07.2016 20:39

destus,
Ну и остальные красные ошибки уловил как убрать:

dgram: "empty",
dns: "empty"


осталась только желтая.
И что означали те красные ошибки - хз, мб они еще потом вылезут боком.

destus 23.07.2016 20:49

lakusha,
Ну это вроде как модуль для ноды, а ты его на фронте используешь.

lakusha 23.07.2016 20:56

destus,
Окей, я понял. Спасибо за помощь.


Часовой пояс GMT +3, время: 18:45.