babel 导入语句有问题

Question

我有一个在 ES6 中使用 node 的项目，它使用 babel-node 到运行。现在我正在尝试以更生产的方式实现 babel 并尝试了两次。

具有以下配置的 Webpack babel-loader：

module.exports = {
  entry: './src/cloud/main.js',
  devtool: 'source-map',
  output: {
    path: './src/static/build',
    filename: 'bundle.js'
  },
  module: {
    loaders: [
      {
        test: /\.js$/,
        exclude: /node_modules/,
        loaders: [
          'babel-loader?presets[]=es2015',
        ],
      },
      {
        test: /\.css$/,
        loaders: [
          'style-loader',
          'css-loader',
        ],
      },
      {
        test: /\.html$/,
        loaders: [
          'raw-loader',
        ],
      },
    ],
  },
}

它开始抱怨 main.js 中的 import 语句，为了使它静音，我使用了 ?presets[]=es2015，这是我在类似问题中发现的。然后问题来了，它过滤到带有以下消息的 node_modules 的导入语句：

./~/socket.io/lib/index.js 出错找不到模块：错误：无法在

中解析模块 'fs'

我的另一种方法是使用这样的注册挂钩：

require('babel-core/register')({
  ignore: /node_modules/,
});
require('./main.js');

但它抛出了这条信息：从 'express' 进口快递； ^^^^^^

语法错误：意外的保留字

//main.js - 简化

import express from 'express'
const app = express()
const server = app.listen(port, () => {
  console.log(`Listening at http://${server.address().address === '::' ? 'localhost' : server.address().address}:${server.address().port}`)
})

Answer 1

我认为您不需要在加载程序配置中排除 node_modules。但是，您可能想让 webpack 知道要解析什么。尝试添加如下内容：

resolve: {
    root: path.join(__dirname),
    fallback: path.join(__dirname, 'node_modules'),
    modulesDirectories: ['node_modules'],
    extensions: ['', '.json', '.js', '.jsx', '.scss', '.png', '.jpg', '.jpeg', '.gif']
},

modulesDirectories 键应该让 webpack 从运行下来在你的工作目录中的每一个 require / import。

此外，将目标添加到配置的顶部应该可以解决 fs

等内置问题

target: 'node'

Answer 2

好的，多亏了其他答案和 4m1r 的答案，我明白了。我post示例代码。

var path = require('path');
var fs = require('fs');

var nodeModules = {};
fs.readdirSync('node_modules')
  .filter(function (x) {
    return ['.bin'].indexOf(x) === -1;
  })
  .forEach(function (mod) {
    nodeModules[mod] = 'commonjs ' + mod;
  });

module.exports = {
  name: 'server',
  target: 'node',
  context: path.join(__dirname, 'src', 'cloud'),
  entry: {
    server: './main.js'
  },
  output: {
    path: path.join(__dirname),
    filename: '[name].js'
  },
  externals: nodeModules,
  module: {
    loaders: [
      {test: /\.js$/, exclude: /node_modules/, loaders: ['babel-loader?presets[]=es2015']}
    ]
  },
  resolve: {
    root: path.join(__dirname),
    fallback: path.join(__dirname, 'node_modules'),
    modulesDirectories: ['node_modules'],
  }
};

真正重要的是外部密钥，它防止它通过要求泄漏到 node_modules，并出于某种原因在 babel-loader 中指定 ?presets[]=2015。我接受 4m1r，因为它最终修复了代码。

babel 导入语句有问题

babel having trouble with import statement

node.js

express

webpack

babeljs