Webpack自动启动浏览器

自动启动浏览器，使用webpack 4打开浏览器时也可以指定页面。

"scripts": {
   ...
   "start": "webpack-dev-server --open-page index2.html"
}

directory/folder: package.json

{
  "devDependencies": {
  "babel-core": "^6.26.3",
  "babel-loader": "^7.1.5",
  "babel-preset-es2015": "^6.24.1",
  "babel-preset-react": "^6.24.1",
  "webpack": "^4.16.0",
  "webpack-dev-server": "^3.1.4"
},
  "name": "",
  "version": "1.0.0",
  "main": "index.js",
  "license": "MIT",
  "description": "",
  "author": "",
  "private": false,
  "scripts": {
    "start": "webpack-dev-server --open --watch"
 },
  "dependencies": {
    "webpack-cli": "^3.0.8"
  }
}

该启动脚本将运行开发服务器，并自动打开和更新（保存）网页。这是针对WebPack 4的。

对于使用Node.js（和npm）的用户：将命令放在npm启动脚本中：

苹果电脑

"scripts": {
    "start": "webpack-dev-server & open http://localhost:8080/"
  }

视窗

"scripts": {
    "start": "start http://localhost:8000/ & webpack-dev-server"
}

感谢Enzo Ferey指出在Windows上，该命令需要看起来有所不同。

Emelet答案根本不是错误的，但是在Windows中将不起作用。我这样做：

"scripts": {
    "start": "start http://localhost:8000/ & webpack-dev-server"
}

100％工作，您无需安装任何模块或插件。

要启动浏览器，可以将其添加--open到CLI命令，因为接受的答案指出了该命令

npm start --open

要么

ng serve --open

为了避免一直这样做：只需进行一个简单的更改即可 package.json

"scripts": {
    "ng": "ng",
    "start": "ng serve --open",
    ...
  },

对于Webpack版本2.x，您只需按以下说明将--openopen 添加到CLI：

https://webpack.js.org/configuration/dev-server/#devserver-open

或者，将以下配置添加到您的webpack.config.js：

devServer: {
  open: true
}