Question

当前，我运行位于同一仓库中的两个应用。

第一个运行在$data = mysqli_fetch_assoc($quert); $text = $data['text_col']; $text_break_line = nl2br($text); echo "<p>'$text_break_line'</p>";上，另一个运行在/（不同的HTML文件）上。

我想制作另一个可以在port 3000（带有它自己的HTML文件）上运行的应用。

我该怎么做？

这是我的Webpack配置：

port 5000

Answer 1

这是执行此操作的一种方法。您可以尝试使用多个这样的编译器，

//webpack.config.js
[{
    entry: "./entry1.js",
    output: {
        filename: "outpu1.js"
    }
}, {
    entry: "./entry2.js",
    output: {
        filename: "outpu2.js"
    }
}]

然后创建一个这样的节点脚本，

const WebpackDevServer = require("webpack-dev-server")
const webpack = require("webpack")
const config = require("./webpack.config")

const compiler = webpack(config)

const server1 = new WebpackDevServer(compiler.compilers[0], {
    contentBase: __dirname,
    hot: true,
    historyApiFallback: false,
    compress: true,
})

const server2 = new WebpackDevServer(compiler.compilers[1], {
    contentBase: __dirname,
    hot: true,
    historyApiFallback: false,
    compress: true,
})

server1.listen(3000, "localhost", function() {})
server2.listen(5000, "localhost", function() {})

您为每个webpack-dev-server创建一个complier实例。

执行此操作的另一种方法是像这样在package.json中编写多个脚本，

{
   "scripts":{
       "serve1": "webpack-dev-server --content-base <file/directory/url/port> --port 3000",
       "serve2": "webpack-dev-server --content-base <file/directory/url/port> --port 5000"
   }
}

，然后使用npm-run-all运行两个脚本，

npm-run-all serve1 serve2

Answer 2

package.json中的两个节点实例

"scripts": {
    "dev": "NODE_ENV=dev node ./node_modules/.bin/webpack-dev-server --watch --mode=development --config-name='survey' & NODE_ENV=dev node ./node_modules/.bin/webpack-dev-server --watch --mode=development --config-name='account'",
    "build": "node ./node_modules/.bin/rimraf ./dist && node ./node_modules/.bin/webpack-cli --mode=production"
  },

这是两个不同的配置。在每个配置中都有不同的开发配置

const account = require("./account.config");
const survey = require("./survey.config");
module.exports = [account, survey];

Webpack开发服务器-在多个端口上运行多个应用

2 个答案: