如何在 javascript 中使用 npm 腳本

Question

我需要一個完整的指南或一個很好的參考資料來解決在 javascript 文件中運行模塊命令的問題。

說我經常跑：

$ npm run webpack-dev-server --progress --colors -- files

如何在 javascript 文件中運行它並執行

$ node ./script.js

腳本.js

var webpackDevServer = require('webpack-dev-server');

// need help here
var result = webpackDevServer.execute({
  progress: true,
  colors: true,
}, files);

Answer 1

回答

我為我的 Webpack 包做這樣的事情。 您可以簡單地使用child_process.spawn來執行命令行程序並在節點腳本中處理進程。

下面是一個例子：

var spawn = require('child_process').spawn

// ...

// Notice how your arguments are in an array of strings
var child = spawn('./node_modules/.bin/webpack-dev-server', [
    '--progress',
    '--colors',
    '<YOUR ENTRY FILE>'
]);

child.stdout.on('data', function (data) {
    process.stdout.write(data);
});

child.stderr.on('data', function (data) {
    process.stdout.write(data);
});

child.on('exit', function (data) {
    process.stdout.write('I\'m done!');
});

您可以處理您喜歡的所有事件。 這是一個相當強大的模塊，它允許您查看進程的 PID ( child.pid )，甚至可以在您選擇時child.kill()進程 ( child.kill() )。

---

附錄

一個巧妙的技巧是將所有內容都放入Promise 。 這是我的script.js版本的簡化示例：

module.exports = function () {
    return new Promise(function (resolve, reject) {
        var child = spawn('./node_modules/.bin/webpack', [
            '-d'
        ]);

        child.stdout.on('data', function (data) {
            process.stdout.write(data);
        });

        child.on('error', function (data) {
            reject('Webpack errored!');
        });

        child.on('exit', function () {
            resolve('Webpack completed successfully');
        });
    });
}

使用此方法，您可以將script.js包含在其他文件中，並使此代碼在您的構建系統或其他任何文件中同步。 可能性是無限的！

---

編輯child_process.exec還允許您執行命令行程序：

var exec = require('child_process').exec

// ...

var child = exec('webpack-dev-server --progress --colors <YOUR ENTRY FILES>',
  function(err, stdout, stderr) {
    if (err) throw err;
    else console.log(stdout);
});

Answer 2

接受的答案在 Windows 上不起作用並且不處理退出代碼，因此這是一個功能齊全且更簡潔的版本。

const spawn = require('child_process').spawn
const path = require('path')

function webpackDevServer() {
    return new Promise((resolve, reject) => {
        let child = spawn(
            path.resolve('./node_modules/.bin/webpack-dev-server'),
            [ '--progress', '--colors' ],
            { shell: true, stdio: 'inherit' }
        )
        
        child.on('error', reject)
        child.on('exit', (code) => code === 0 ? resolve() : reject(code))
    })
}

path.resolve()正確格式化腳本的路徑，無論主機操作系統如何。

spawn()的最后一個參數有兩件事。 shell: true使用 shell，它在 Windows 上附加.cmd ，如有必要， stdio: 'inherit'通過 stdout 和 stderr，所以您不必自己做。

此外，退出代碼很重要，尤其是在運行 linters 等時，所以除 0 之外的任何內容都會被拒絕，就像在 shell 腳本中一樣。

最后，當命令執行失敗時會發生error事件。 使用 shell 時，不幸的是錯誤總是空的（ undefined ）。

Answer 3

你需要它是 webpack-dev-server 嗎？ 有一個等效的 webpack-dev-middleware 用於在 node/express 中運行：

'use strict';
let express = require('express');
let app = new express();

app.use(express.static(`${__dirname}/public`));

let webpackMiddleware = require('webpack-dev-middleware');
let webpack = require('webpack');
let webpackConfig = require('./webpack.config.js');
app.use(webpackMiddleware(webpack(webpackConfig), {}));

app.listen(3000, () => console.log(`Server running on port 3000...`));

https://github.com/webpack/webpack-dev-middleware