前端开发工具-本地服务器

http-server

npm install http-server -g

然后直接在想要预览的文件输入
http-server 指令

《前端开发工具-本地服务器》

优点:

  1. 只要连接同一个wifi,就可以多端预览
  2. 配置信息不多,方便快速预览

缺点:不过有个需要手动刷新

BrowserSync

npm install -g browser-sync

//静态页同步
// --files 路径是相对于运行该命令的项目(目录)  
//指令的意思是,监听index.html文件,当css文件夹css后缀的文件变化时,浏览器自动刷新
browser-sync start --server --files "css/*.css"

//代理服务器
browser-sync start --proxy "主机名" "css/*.css"
//or
browser-sync start --proxy "Browsersync.cn" "css/*.css"

注意!!!

browser-sync默认打开index.html

如果要同步的文件名不是index.html 则使用如下指令

例:我的文件名为bower.html

browser-sync start –server –index bower.html –files=”css/*.css”

优点:

  1. 自动刷新,省去手动刷新的繁琐
  2. 只要连接同一个wifi,就可以多端预览

缺点

  1. 配置信息多,多页面开发时,切换页面需要重新配置

apache

我是下载了个xampp
《前端开发工具-本地服务器》

缺点

  1. 无法多端预览

资料

http-server
BrowserSync
In browser I see only : Cannot GET/

    原文作者:wind
    原文地址: https://segmentfault.com/a/1190000011584721
    本文转自网络文章,转载此文章仅为分享知识,如有侵权,请联系博主进行删除。
点赞