webpack - 如何防止 webpack bundle ？

Question

我在我的 webpack 项目中使用 Postgres 和 Sequelize。我遇到了一个错误列表，其中似乎 webpack 正在尝试捆绑 sequelize 或 postgres (pg) 包:

ERROR in ./~/pg/lib/connection.js
Module not found: Error: Cannot resolve module 'net' in /Users/dace/Code/personal/my_project/node_modules/pg/lib
 @ ./~/pg/lib/connection.js 1:10-24

ERROR in ./~/pg/lib/connection.js
Module not found: Error: Cannot resolve module 'tls' in /Users/dace/Code/personal/my_project/node_modules/pg/lib
 @ ./~/pg/lib/connection.js 78:14-28

ERROR in ./~/pg/lib/native/index.js
Module not found: Error: Cannot resolve module 'pg-native' in /Users/dace/Code/personal/my_project/node_modules/pg/lib/native
 @ ./~/pg/lib/native/index.js 1:13-33

ERROR in ./~/pg/lib/connection-parameters.js
Module not found: Error: Cannot resolve module 'dns' in /Users/dace/Code/personal/my_project/node_modules/pg/lib
 @ ./~/pg/lib/connection-parameters.js 2:10-24

ERROR in ./~/pgpass/lib/index.js
Module not found: Error: Cannot resolve module 'fs' in /Users/dace/Code/personal/my_project/node_modules/pgpass/lib
 @ ./~/pgpass/lib/index.js 4:9-22

在我的 webpack 的 dev.config.js 文件中，我有:

var path = require('path');

module.exports = {
  entry: path.join(__dirname, '..', 'src', 'index.js'),
  output: {
    publicPath: '/build/',
    path: path.join(__dirname, '..', 'dist', 'build'),
    filename: 'bundle.js',
  },
  module: {
    loaders: [
      {
        test: /\.js?$/,
        exclude: /node_modules/,
        loader: ['babel'],
        query: {
          presets: ['react', 'es2015'],
        },
      },
    ],
  },
};

然后在我的 index.js 中我有:

var Sequelize = require('sequelize');

var connection = new Sequelize('dev', 'dace', 'root', {
  dialect: 'postgres',
});

var Article = connection.define('article', {
  name: Sequelize.STRING,
})

connection.sync().then(function() {
  Article.create({
    name: 'Dace'
  });
});

我猜我需要阻止 webpack 尝试捆绑 sequelize 或 pg，因为当我从项目中完全删除 webpack 时它可以工作。有没有办法可以配置 webpack 以忽略在我的应用程序中捆绑这些包？

谢谢!

Answer 1

您不应该使用客户端代码中处理数据库、文件系统等的任何内容。例如 fs模块(即 filesystem )仅在 node 中定义环境，浏览器没有任何线索，什么fs可能。 net 也是如此。 (在浏览器中实现不同或根本没有实现)。难怪，webpack对此感到困惑:)

我的建议:将你的代码重写为客户端、服务器和公共(public)部分；确保客户端和服务器部分只做在节点/浏览器环境中有意义的事情。