DartWeb基础—简单入门

DartWeb基础—简单入门

DartWeb的前面是Dart,所以需要先搭建好Dart开发环境,再进行下面的工作

下载Dartium浏览器

Dartium是Chromium的一个特殊的版本,里面包含Dart VM,使用Dartium意味着你不必将代码编译为JavaScript就能调试程序,直到开发完成后再将代码编译为JavaScript测试其他浏览器

Dartium下载地址—传送门

为以后方便开发,可以建立一个快捷方式到桌面

创建并完善应用

在根目录下新建index.html文件

<!DOCTYPE html>
<html>
<head>
    <title>TestWeb</title>
</head>
<body>
    <p id="pid"></p>

    <script type="application/dart" src="main.dart"></script>
</body>
</html>

再在根目录下新建main.dart文件

// dart:html中包括DOM元素类型、CSS样式、本地存储、媒体、语音、事件等
import "dart:html";

void main() {
    querySelector("#pid").text = "Hello World!";
}

代码简易图解

使用Dartium调试

在Dartium中打开index.html,检查代码执行效果。现在用其他浏览器打开,是没有任何效果的

Dart文件转JS文件

由于目前没有任何浏览器支持Dart,所以只能通过dart2js指令将Dart文件转成JS文件,并替换Dart文件,才能发布项目

在根目录下执行dart2js指令

dart2js --out=main.js main.dart

执行完成后,会产生三个文件,但实际有用的只有一个main.js文件

复制index.html文件并重命名为index2js.html,再修改代码,用JS引用替换Dart引用

<!DOCTYPE html>
<html>
<head>
    <title>TestWeb</title>
</head>
<body>
    <p id="pid"></p>

    <script type="text/javascript" src="main.js"></script>
</body>
</html>

现在可以使用任意浏览器打开index2js.html文件

时间: 2024-08-09 04:36:14

DartWeb基础—简单入门的相关文章

hibernate基础简单入门1---helloword

1:目录结果 2:实体类(student.java) package com.www.entity; public class Student { private int id; private String name; private int age; public int getId() { return id; } public void setId(int id) { this.id = id; } public String getName() { return name; } pub

SpringMVC 基础教程 简单入门实例

SpringMVC 基础教程 简单入门实例 标签: Spring MVCspringmvcSpringMVC教程基础教程SpringMVC实例 2013-05-09 13:44 170403人阅读 评论(69) 收藏 举报  分类: Java(23)  Spring框架(3)  版权声明:本文为博主原创文章,未经博主允许不得转载. spring MVC 入门教程二: 一个简单的入门实例教程 该实例的源码和实例中的jar 源码:http://download.csdn.net/detail/swi

Asp.Net MVC3 简单入门第一季(一)环境准备

前言 大家好,从今天开始我将写一个关于AspNet MVC3方 面学习的总结,并跟初学者一起分享一些基本的基础知识,作者本身也很愿意跟大家一起交流技术,一起交流一起进步,欢迎高手不吝赐教,欢迎大家不同的意见和 建议,作者的学识和见识当然有自己的局限性,希望自己能成为不闷骚型的技术人员,而不是只自己享受技术,而不让更多的人来分享你的成果的人. 第一节:关于Asp.Net MVC3 Asp.Net MVC已经到第三版了,相信大家也都熟悉了,我也不再重复相关概念性的东西了.但是大家一定要了解,Asp.

脱壳基础知识入门

现在加解密发展己形成2个分支了,一个就是传统的算法,另一个就是加密壳.越来越多的软件采用了密码学相关算法,现在要做出一个软件注册机己不象前几年那 么容易,这就要求解密者必须要有一定的数学功底和密码学知识,而这些在短时间内是不容易掌握的.除了密码学的应用,越来越多的软件加壳了,因此要求解密者 必须掌握一些脱壳技术,这就使得壳成了解密必须迈过的一个门槛.壳发展到今天,强度越来越高了,将许多人挡在门外,使得大家望壳兴叹.另外,论坛现在两极 分化比较严重,高手讨论的脱壳技术新手看不懂,很多人想学脱壳,但

Web Service简单入门例子

我们一般实现Web Service的方法有很多种.其中我主要使用了CXF Apache插件和Axis 2两种. Web Service是应用服务商为了解决每个问题而提供的在线服务方案,其主要采用了SOAP(Simple Object Access Protocol)协议,数据传输格式使用XML格式来描述,因此也具有跨平台的特性. web广泛用到的技术: TCP/IP:通用网络协议,被各种设备使用 HTML(标准通用标记语言下的一个应用):通用用户界面,可以使用HTML标签显示数据 Java:写一

Linux基础知识入门

[Linux基础]Linux基础知识入门及常见命令. 前言:最近刚安装了Linux系统, 所以学了一些最基本的操作, 在这里把自己总结的笔记记录在这里. 1,V8:192.168.40.10V1:192.168.40.11Linux ip:192.168.40.128 2,Linux是一个操作系统, 与windows的区别:Linux:图形化界面简单,性能很快,在企业中当做服务器来使用.Windows:图形化界面很炫,性能相对差,大众用户.windows的服务器: windows2003,win

mongodb学习(搭建开发环境+简单入门)

接下来这段时间,我将会学习mongodb,由浅入深,并且将学习的过程会详细记录下来.mongodb是什么?我想这一点不需要我过多的解释.好了,废话不多说,我们直奔主题,看看mongodb开发环境的搭建.说明一点,在学习mongodb期间,我的所有 操作都是在windows下完成的.下面我带大家一步一步学习windows下mongodb开发环境的搭建 下载mongodb 首先我们需要到mongodb的官网下载mongodb. http://www.mongodb.org/downloads 新建一

Web Service简单入门示例

我们一般实现Web Service的方法有非常多种.当中我主要使用了CXF Apache插件和Axis 2两种. Web Service是应用服务商为了解决每一个问题而提供的在线服务方案,其主要採用了SOAP(Simple Object Access Protocol)协议,传输数据格式使用XML格式来描写叙述.因此也具有跨平台的特性. web广泛用到的技术: TCP/IP:通用网络协议.被各种设备使用 HTML(标准通用标记语言下的一个应用):通用用户界面,能够使用HTML标签显示数据 Jav

cmd 与 bash 基础命令入门

身为一个程序员会用命令行来进行一些简单的操作,不是显得很装逼嘛!?嘿嘿~ ヾ(>?<) cmd 与 bash 基础命令入门 ??????简介 ??????CMD 基础命令 ????????????目录操作 ??????????????????切换目录 ??????????????????列出文件与子目录 ??????????????????创建目录 ??????????????????删除目录 ??????????????????复制目录 ??????????????????移动目录 ????