Невозможно импортировать Express с Babel и Webpack

Я использую webpack и babel для создания приложения с использованием синтаксиса ES6. Проблема в том, что я не могу импортировать express.

(Примечание: я могу импортировать (и требовать) модуль узла «путь», больше не проверял)

Вот мое приложение:

import express from 'express';

Даже приведенное ниже приводит к той же ошибке:

var app = require('express');

Вот мой webpack.config.js

module.exports = {
    entry: './src/app.js',
    output: {
        path: 'builds',
        filename: 'bundle.js'
    },
    module: {
        loaders: [
            {
                test: /\.js/,
                loader: 'babel',
                include: __dirname + '/src',
                exclude: /node_modules/,
                query: {
                    presets: ['es2015']
                }
            }
        ],
    }
};

Я также пробовал следующее:

exclude: [/node_modules/],
exclude: __dirname + '/node_modules',

Но я все еще продолжаю получать очень большую трассировку стека, которая начинается с:

WARNING in ./~/express/lib/view.js
Critical dependencies:
78:29-56 the request of a dependency is an expression
 @ ./~/express/lib/view.js 78:29-56

ERROR in ./~/express/lib/request.js
Module not found: Error: Cannot resolve module 'net' in /home/projects/node_modules/express/lib
 @ ./~/express/lib/request.js 18:11-25

ERROR in ./~/express/lib/view.js
Module not found: Error: Cannot resolve module 'fs' in /home/projects/node_modules/express/lib
 @ ./~/express/lib/view.js 18:9-22

И заканчивается

 @ ./~/mime/mime.js 87:12-35

ERROR in ./~/mime-db/db.json
Module parse failed: /home/projects/node_modules/mime-db/db.json Line 2: Unexpected token :
You may need an appropriate loader to handle this file type.
| {
|   "application/1d-interleaved-parityfec": {
|     "source": "iana"
|   },
 @ ./~/mime-db/index.js 11:17-37

Я думаю, это потому, что папка node_modules не игнорируется?

Также это мой package.json, если, возможно, версии модуля являются проблемой:

{
  "name": "testing",
  "version": "1.0.0",
  "description": "",
  "main": "index.js",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "author": "",
  "license": "MIT",
  "dependencies": {
    "express": "^4.13.4"
  },
  "devDependencies": {
    "babel-core": "^6.6.0",
    "babel-loader": "^6.2.4",
    "babel-preset-es2015": "^6.6.0",
    "webpack": "^1.12.14"
  }
}

person Kartik Anand    schedule 02.03.2016    source источник
comment
У меня тоже есть эта проблема! Получение тонн Can't resolve 'fs' и Can't resolve 'net'   -  person Enrique Moreno Tent    schedule 14.08.2017


Ответы (2)


Это можно исправить с помощью json-loader:

npm install json-loader --save-dev

И в webpack.config добавляем этот загрузчик:

{ test: /\.json$/, loader: "json-loader" }
person Michael Plakhov    schedule 03.03.2016
comment
Почему мне нужно добавить еще один загрузчик, чтобы решить проблему с каким-то другим загрузчиком? Почему я не могу просто игнорировать node_modules? - person Kartik Anand; 03.03.2016
comment
Сильно в этом вопросе не копался, просто исправил для себя. Похоже, что webpack находит mime/db.json и не может работать с этим типом файла. - person Michael Plakhov; 03.03.2016
comment
Также у вас будут проблемы с модулями node.js, такими как net, fs и т. д., если вы не укажете цель: «узел» в конфигурации веб-пакета. Некоторые люди создают отдельные конфиги для фронтэнда и бэкенда. - person Michael Plakhov; 03.03.2016
comment
Я думаю, вы думали, что я хочу связать экспресс в своем приложении. Я не хочу этого делать, я просто хочу запустить на нем транспайлер babel. - person Kartik Anand; 03.03.2016

Пожалуйста, посмотрите на этот ответ. SudoPlz — общий рабочий пример. Похоже на метод, предложенный Михаилом Плаховым.

person Shulyk Volodymyr    schedule 03.03.2016
comment
Я не хочу связывать экспресс в свой код, как в ответе. Я просто хочу запустить на нем транспайлер babel. Вот и все. Никаких узловых модулей или комплектаций или чего-то еще. - person Kartik Anand; 03.03.2016
comment
Если вы хотите просто транспилировать, почему бы не использовать скрипт npm специально для транспиляции вашего экспресс-кода? Webpack предназначен для упаковки вещей для внешнего интерфейса. - person Sgnl; 15.05.2016
comment
этот ответ работает для меня .. как говорится в вопросе, импортируйте экспресс с помощью веб-пакета .. но он также упаковывает код узла в браузере - person Alexander; 17.01.2017