帮酷LOGO
  • 显示原文与译文双语对照的内容
文章标签:bro  Cordova  浏览  browsers  plugin  
BrowserSync Plugin for Cordova

  • 源代码名称:cordova-plugin-browsersync
  • 源代码网址:http://www.github.com/nparashuram/cordova-plugin-browsersync
  • cordova-plugin-browsersync源代码文档
  • cordova-plugin-browsersync源代码下载
  • Git URL:
    git://www.github.com/nparashuram/cordova-plugin-browsersync.git
  • Git Clone代码到本地:
    git clone http://www.github.com/nparashuram/cordova-plugin-browsersync
  • Subversion代码到本地:
    $ svn co --depth empty http://www.github.com/nparashuram/cordova-plugin-browsersync
    Checked out revision 1.
    $ cd repo
    $ svn up trunk
  • Cordova浏览器同步插件

    dependencies StatusdevDependencies Status

    BrowserSync插件集成到你的Cordova工作流中。

    • 监视 www 文件夹中的文件并自动重新加载所有已经连接设备中的HTML和 CSS
    • 使用browsersync的指示板来控制设备并重新加载。
    • 在多个设备之间同步滚动,单击和表单输入。
    • 支持iOS和Android平台的真实设备和仿真器

    演示

    下面是一个博客帖子,解释插件及其内部内容。

    Cordova Browser-Sync Plugin demo video

    用法

    有三种方法可以使用这个插件中的代码。 确保你已经将 ws:unsafe-inline CSP策略添加到 index.html 文件中CSP元标记( <meta content=...> )的default-src 部分。

    请注意,可能需要将 -- --live-reload 传递给 cordova run 命令。

    这个 --live-reload 标志的存在触发了实时重新加载工作流。 如果没有这里标志,项目将保持不变。 这样,插件就不必在打包之前被删除以便最终部署。

    插件作为Cordova插件( 轻松)

    将它集成到Cordova工作流中的最简单方法是将它添加为插件

    cordova plugin add cordova-plugin-browsersync

    然后运行 cordova with cordova run -- --live-reload

    注释

    如果你在执行时遇到像 below 这样的错误 "cordova plugin add cordova-plugin-browsersync" 命令

    Failed to install 'cordova-plugin-browsersync': Error: Cannot find module 'npm'

    请尝试升级 npm 命令版本,这是你的系统全局安装的以下命令。

    npm install -g npm

    我没有确认任何东西,但是这个错误可以能是由于全局安装和本地安装的npm 模块的版本。

    作为Cordova项目钩子

    克隆这里 repo 并运行 npm run createHook 以获得 after_prepare.js 。 将这里文件作为 after_preparehook 添加到你的config.xml. 中,例如:

    <hook type="after_prepare" src="scripts/after_prepare.js"/>

    集成到你的工作流程中

    您还可 require('cordova-plugin-browsersync') 在 node 模块中,直接在现有工作流中使用 changeHost 函数和 browserSyncServer

    命令行选项

    忽略文件

    在很多情况下,其他钩子可以通过 assets 。CSS或者图像复制到像 wwwlib 这样的文件夹中,比如像 bower_components 这样的。 这些钩子可能在 after_prepare 处运行,因此在实时重新加载工作流中应该被忽略。 要实现这里目的,请运行以下命令

    cordova run -- --live-reload --ignore=lib/**/*.*

    --ignore 命令将一个 anymatch 兼容目标 relative takes到 www 文件夹。

    设置自定义主机名

    有时,根据你的网络,你的操作系统将报告多个外部IP地址。 如果发生这种情况,browsersync默认会选择第一个,并希望获得最好的。

    要覆盖这里行为并手动选择要用于外部接口的主机,请使用 --host 选项,例如:

    cordova run -- --live-reload --host=192.168.1.1

    设置自定义端口

    如果你需要将端口从本地计算机转发到设备,因为设备不会与设备相同。 如果发生这种情况,问题可能是 3000 端口。 然后你可以尝试另一个示例,例如 8090,然后。

    cordova run -- --live-reload --port=8090

    设置自定义索引文件

    如果你的config.xml 中没有"index.html",那么你需要将这个选项设置为。 请使用 --index 选项。

    cordova run -- --live-reload --index=content.html

    启用 https

    如果你需要 https,可以使用这里选项启用它。 你可以使用 --https 例如。

    cordova run -- --live-reload --https


    文章标签:plugin  bro  浏览  Cordova  browsers  

    Copyright © 2011 HelpLib All rights reserved.    知识分享协议 京ICP备05059198号-3  |  如果智培  |  酷兔英语