Javascript 浏览器同步网页包插件不工作

我已按照以下说明对其进行了配置：

这是我的webpack.config.js文件

const path = require('path');
const BrowserSyncPlugin = require('browser-sync-webpack-plugin');

const config = {
  mode: 'production',
  entry: './src/app.js',
  output: {
    path: path.resolve(__dirname, 'dist'),
    filename: 'bundle.js',
  },
  watch: true,
  plugins: [
    new BrowserSyncPlugin({
      host: 'localhost',
      port: 3000,
      server: {
        baseDir: ['dist']
      }
    })
  ]
}

module.exports = config;

package.json

{
  "name": "real-estate-2",
  "private": true,
  "version": "1.0.0",
  "description": "",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1",
    "start": "webpack --config webpack.config.js"
  },
  "keywords": [],
  "author": "",
  "license": "ISC",
  "devDependencies": {
    "browser-sync-webpack-plugin": "^2.2.2",
    "webpack": "^4.8.3",
    "webpack-cli": "^2.1.3"
  },
  "dependencies": {
    "lodash": "^4.17.10",
    "react": "^16.3.2",
    "react-dom": "^16.3.2"
  }
}

但当我运行该网页包时，在终端上出现以下错误： 错误：找不到模块“浏览器同步网页包插件”

---

我已经按照说明安装了浏览器同步网页包插件：npm安装--保存开发人员浏览器同步网页包插件

请显示项目包的内容。我已经更新了上面的package.json文件。我猜问题出在您的项目结构中。你还可以截图文件树吗？这是我的项目文件结构：我在本地安装了浏览器同步后，它工作了。多谢各位。我刚开始学习使用网页，遇到了很多困难。你能给我一张脸书吗？这样我就可以和你联系了。再次感谢^^。为什么需要浏览器同步pakcage，因为

loadash

是浏览器同步网页插件所需的唯一依赖项。链接->

https://www.npmjs.com/package/browser-sync-webpack-plugin

。

npm install --save-dev browser-sync