2

Мне нужно использовать 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',
            query: {
              presets: ['es2015'],
              plugins: ['transform-runtime']
            }
        }]
    },
};

1 ответ 1

3

Необходимо добавить в webpack.config.js параметр target со значением "node":

{
    target: 'node'
}

Эта опция говорит Webpack'у о том, под какую среду собирается бандл. По умолчанию значение этой опции установлено в "web" и бандл собирается под браузеры. В отличие от среды Node.js, у браузеров нет таких "встроенных" модулей как fs, tls, net и т.д. (с ними у вас вылетают ошибки), следовательно при сборке для браузера Webpack старается их найти в папке node_modules/, где их очевидно нет, что и является результатом ошибки. При переключении среды на Node.js, Webpack будет автоматически игнорировать подключения встроенных Node.js модулей и сборка пройдет успешно.

Пункт в документации Webpack о параметре target

Ваш ответ

By clicking “Отправить ответ”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.