webpack + shelljs将抛出“错误:找不到模块‘/exec-child.js.’”

Question

我想使用shelljs用javascript编写一些脚本，因为我想使用一些新的JavaScript特性，所以我使用Babel + webpack将我的代码捆绑到单个包js中。

代码非常简单：

entry.js

import shell from 'shelljs'

shell.exec('ls')

webpack.conf.js

module.exports = {
    mode: "development",
    target: 'node',
    entry: './entry.js',
    output: {
        path: __dirname,
        filename: './dist/bundle.js'
    },
    module: {
        rules: [{
            test: /\.js$/,
            use: [{
                loader: 'babel-loader', options: {
                    presets: ['@babel/preset-env']
                }
            }]
        }]
    }
}

package.json

{
  "scripts": {
    "demo": "webpack && node ./dist/bundle.js"
  },
  "devDependencies": {
    "@babel/core": "7.2.2",
    "@babel/preset-env": "7.4.2",
    "babel-loader": "8.0.6",
    "webpack": "4.28.1",
    "webpack-cli": "3.2.1"
  },
  "dependencies": {
    "shelljs": "0.8.3"
  }
}

当我运行"npm安装&& npm运行演示“时，它抛出：

Error: Cannot find module '/exec-child.js'
    at Function.Module._resolveFilename (internal/modules/cjs/loader.js:636:15)
    at Function.Module._load (internal/modules/cjs/loader.js:562:25)
    at Function.Module.runMain (internal/modules/cjs/loader.js:829:12)
    at startup (internal/bootstrap/node.js:283:19)
    at bootstrapNodeJSCore (internal/bootstrap/node.js:622:3)
webpack:///./node_modules/shelljs/src/common.js?:412
        throw e;
        ^

ShellJSInternalError: ENOENT: no such file or directory, open '/var/folders/gm/t8kf08qn0598qcl_vkxxyhxc0000gr/T/shelljs_d7da547d2136239bb317'
    at Object.openSync (fs.js:443:3)
    at Object.readFileSync (fs.js:343:35)
    at execSync (webpack:///./node_modules/shelljs/src/exec.js?:85:17)
    at Object._exec (webpack:///./node_modules/shelljs/src/exec.js?:213:12)
    at Object.eval [as exec] (webpack:///./node_modules/shelljs/src/common.js?:348:23)
    at eval (webpack:///./entry.js?:5:48)

我搞不懂为什么。

这里还有一个完整的小演示，您只需克隆并运行它：

https://github.com/freewind-demos/javascript-shelljs-webpack-demo

Answer 1

我可以通过修改Webpack的配置来解决这个问题。

ShellJS使用节点执行一个名为exec-child.js - 编写时的代码的JS文件。

问题是捆绑的代码不知道文件在哪里，原因有两个。

1. 除了node: false之外，还需要指定target: node以避免全局模拟。有一个很好的写这里。
2. 您需要显式地将文件复制到您的输出目录，因为__dirname将指向那里，然后path.join(__dirname, 'exec-child.js')将是有效的。您可以使用copy-webpack-plugin来完成这个任务。下面是我正在工作的配置的示例。