编辑:您也可以跳过所有这些,只需在编辑器中按CTRL R.如果您在Dart编辑器之外使用工具(但仍然依赖于它来构建过程),或者希望在没有焦点转移到Dartium窗口的情况下进行代码和预览,则下面的脚本可能仍然有用.
剪掉击键并自动化你的猴子!
这种技术使用dart.build在您对项目进行更改时“触摸”HTML文件,然后依赖于LivePage扩展在浏览器中刷新它.
>启动Dartium并安装LivePage扩展. (设置|扩展|获取更多扩展| LivePage来自www.fullondesign.co.uk |添加到chrome)
>运行您的项目.在Dartium中查看页面时,单击LivePage图标.将出现红色“实时”叠加层.这意味着LivePage正在观看html文件及其资产(例如css文件)以进行更改.
>通过快速更改html文件并保存来测试. Dartium中的页面应该更新.
>在项目的pubspec.yaml所在的目录中创建build.dart文件.每当您在项目中进行更改时,Dart编辑器都会运行此文件(例如,当您保存对任何.dart文件的更改时).
>将以下代码放在build.dart中.更新“web / yourpage.html”以指向由LivePage监控的HTML文件.
>现在更改一个.dart文件,保存它,然后观看魔法展开.
简而言之:保存代码▶Dart编辑器触发build.dart▶触摸html文件▶LivePage刷新Dartium
import 'dart:io';
// This number needs to be high enough to prevent the Dart Editor from going
// into an "infinite compile" loop. If that happens,simply comment out the
// call to touch() below and save this file.
const int MIN_INTERVAL_MS = 5000;
const String HTML_FILE = 'web/yourpage.html';
void main() {
build(new Options().arguments,[HTML_FILE]);
touch(HTML_FILE,new Duration(milliseconds:MIN_INTERVAL_MS));
}
/// Save a small,trivial change to the contents of [filename],unless
/// its already been modified within the last [interval].
void touch(String filename,[Duration interval]) {
const int SPACE = 32;
var file = new File(filename);
if (?interval &&
new Date.now()
.difference(file.lastModifiedSync())
.inMilliseconds < interval.inMilliseconds) return;
RandomAccessFile f = file.openSync(FileMode.APPEND);
try {
// If the file doesn't end with a space,append one,otherwise remove it
int length = f.lengthSync();
f.setPositionSync(length - 1);
if (f.readByteSync() == SPACE) {
f.truncateSync(length - 1);
} else {
f.writeByteSync(SPACE);
}
} finally {
f.closeSync();
}
}
如果需要进行故障排除,可以从命令行运行dart build.dart.
touch()函数可以在文件末尾附加或删除尾随空格.注意如果您更改的所有内容都是修改日期,则LivePage似乎不会执行任何操作.
因为Dart编辑器总是监视你的文件,它会接受build.dart所做的更改,去“嘿,这个项目刚刚改变”,然后再次调用build.dart ……再次……避免
无限循环,如果文件至少为MIN_INTERVAL_MS,则该脚本仅触及该文件.
LivePage有一个功能,可以在更改时不引人注目地“重新注入”CSS和Javascript片段,而无需强制刷新整个页面.不幸的是,这里使用的强力技术(即覆盖html文件)会覆盖该行为.
Dart人员还提供了一个web_ui页面,讨论了工具,但请注意,实际上并不需要安装web.ui包以使build.dart工作.