如何在本地域中使用vagrant和browsersync？

我使用vagrant，并将其配置为更新我的etc/host文件，下面是一个示例

10.20.1.36  example.dev

然后，我可以使用

我想从命令行使用browsersync，但我无法访问我的站点。我已经在我的mac主机和vagrant VM上安装了browsersync。我已经用下面的命令在我的mac和VM上试过了，但在这两种环境下都不起作用

browser-sync start --proxy "example.dev" --files "public/*.html,public/css/*.css,public/js/*.js"

这是我从Mac电脑上得到的

[BS] Proxying: http://example.dev
[BS] Access URLs:
 -------------------------------------
   Local: http://localhost:3000
External: http://192.168.0.10:3000
 -------------------------------------
      UI: http://localhost:3001
 UI External: http://192.168.0.10:3001
 -------------------------------------
[BS] Watching files...

下面是VM中发生的情况

[BS] Proxying: http://example.dev
[BS] Now you can access your site through the following addresses:
[BS] Local URL: http://localhost:3000
[BS] External URL: http://10.0.2.15:3000
[BS] Watching files...

当我在mac上运行它时，我可以访问浏览器同步ui，但不能访问我的网站

我不确定应该在哪里运行它。如何在浏览器中访问网站。如果我需要转发虚拟机中的任何端口

搜索网页会返回很多结果，但它们都是咕噜咕噜或咕噜咕噜的，我不使用任何一种

编辑：我将端口转发添加到vagrant，然后从vm中启动浏览器同步。现在一切都在

http://example.dev:3000

和

http://example.dev:3001

以下是我添加到我的文件中的内容：

config.vm.network:forwarded_port，guest:3000，host:3000，auto_correct:true
config.vm.network:forwarded_port，guest:3001，host:3001，auto_correct:true

以下是我如何让它工作的

我将端口转发添加到vagrant，然后从vm中启动浏览器同步。现在一切都在

http://example.dev:3000

和

http://example.dev:3001

以下是我添加到我的文件中的内容：

config.vm.network:forwarded_port，guest:3000，host:3000，auto_correct:true
config.vm.network:forwarded_port，guest:3001，host:3001，auto_correct:true

1.-我用过这个盒子

2.-在Windows上配置虚拟主机

C:\Windows\System32\drivers\etc\host

192.168.33.10   exampleurl.app

3.-在文件夹项目上运行

vagrant up

4.-安装浏览器同步

npm install -g browser-sync

5.-运行浏览同步

browser-sync start -p "exampleurl.app" -f "public, resources, otherfolder, namefiles, etc"

您将看到有关设备连接的信息

[BS] Proxying: http://exampleurl.app
[BS] Access URLs:
 -------------------------------------
       Local: http://localhost:3000
    External: http://192.168.1.77:3000
 -------------------------------------
          UI: http://localhost:3001
 UI External: http://192.168.1.77:3001
 -------------------------------------
[BS] Watching files...

6.-使用此ip连接

http://192.168.1.77:3000

---

我知道这已经得到了回答，我最初使用@KahunaCoder的解决方案来启动并运行，所以谢谢

然而，我发现从流浪者内部运行我的gulpfile非常慢！所以，我想我会发布这个解决方案，以防它有帮助

我的主机文件是：

192.168.5.10    www.develop.local

最后，我在我的文件中使用了以下内容：

server_ip = "192.168.5.10"    
config.vm.network :forwarded_port, guest: 80, host: 3000, auto_correct: true

（Vagrant中的Apache正在端口80上运行。我没有麻烦转发端口3001，因为这只是为了访问Browsersync UI）

现在，我从项目中运行我的Gulp任务，并获得以下结果：

[Browsersync] Proxying: http://www.develop.local
[Browsersync] Access URLs:
 -------------------------------------
       Local: http://localhost:3000
    External: http://151.101.129.69:3000
 -------------------------------------
          UI: http://localhost:3001
 UI External: http://151.101.129.69:3001
 -------------------------------------

现在当我打开

http://localhost:3001

我看到Browsersync控制中心，当我打开

http://localhost:3000

在我的各种浏览器中，我看到我的开发站点和所有连接的浏览器都列在控制中心-因此它们与Browsersync“同步”，并且可以集中控制和镜像操作

---

提供的外部地址允许我通过同一网络上的其他设备连接到我的开发服务器。

那么您转发了3000到3000的哪些端口@KahunaCoder您是否可以提供一个答案，其中包含一些更详细的步骤，描述您如何在“流浪者”框中进行端口转发。这对社区非常有用。您可能应该重新编辑您的帖子，并将解决方案作为一个单独的答案，这样这个问题看起来就得到了回答。您所说的“我从vm中启动浏览器同步”是什么意思？您的整个开发环境都在vagrant VM上吗？是的，我的开发环境在我的VM内。主机上只有我的代码。这本身似乎是一个主要的权限专长，因为我在windows上，我得到了

mkdirs sync.js:49

ELIFECYCLE

和

EPROTO

错误。我已经尝试了所有我能在网上找到的方法来克服这个问题。它可能无法写入代码/dir