无法使用 Babel 和 Webpack 导入 Express答案

【问题标题】：Not able to import Express with Babel and Webpack无法使用 Babel 和 Webpack 导入 Express
【发布时间】：2016-06-15 15:31:22
【问题描述】：

我正在使用 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"
  }
}

【问题讨论】：

我也有这个问题！获取大量 Can't resolve 'fs' 和 Can't resolve 'net'

标签： javascript express webpack babeljs

【解决方案1】：

这可以通过使用 json-loader 来解决：

npm install json-loader --save-dev

然后在 webpack.config 中添加这个加载器：

{ test: /\.json$/, loader: "json-loader" }

【讨论】：

为什么我需要添加另一个加载器来解决另一个加载器的问题？为什么我不能忽略 node_modules？
我没有深入研究这个问题，只是为自己解决了。看起来 webpack 找到了 mime/db.json 并且无法处理这种文件类型。
如果你不在 webpack 配置中指定 target: 'node'，你也会遇到 node.js 模块的问题，比如“net”、“fs”等。有些人为前端和后端创建单独的配置。
我猜你以为我想在我的应用程序中捆绑 express。我不想这样做，我只想在上面运行 babel transpiler。

【解决方案2】：

请看这个answer。 SudoPlz - 共享工作示例。看起来像迈克尔普拉霍夫建议的方法。

【讨论】：

我不想像答案那样将 express 捆绑到我的代码中。我只想在上面运行 babel transpiler。而已。没有节点模块或捆绑或任何东西。
如果您只想转译，为什么不使用专门的 npm 脚本来转译您的 express 代码？ Webpack 用于为前端打包东西。
这个答案对我有用.. 正如问题所说，使用 webpack 导入 express .. 但它也在浏览器上打包了节点代码