https://github.com/channg/wakeup
wakeup是我最近开发的一个小工具,目的是为了让我们更快捷的使用需要编译的代码。
当我们编写了一个html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<script src="index.js"></script>
</body>
</html>
如果不经过编译,那么我们在index.js
只能使用浏览器支持的语法去编写代码。
但是有了wakeup我们可以编写任何代码在index.js
,比如说引用一个nodejs库等等
import moment from 'moment'
export defalut {
mm:moment
}
只要安装wakeup
,接着运行wakeup watch
,wakeup 会帮助你自动编译index.js
并开启一个服务,承载这个html
你不用配置,就得到了一个拥有babel
,commonjs
,esm
的环境。
当然,wakeup还支持对stylesheet的支持
<head>
<meta charset="UTF-8">
<title>Title</title>
<link rel="stylesheet" href="wake.css">
<link rel="stylesheet" href="wake1.less">
<link rel="stylesheet" href="wake2.styl">
<link rel="stylesheet" href="wake3.sass">
</head>
你只需要像曾经写css一样的方式引用这些stylesheet文件,设置可以直接引用less
,sass
,styl
当然,这些依然不需要配置,但是可能需要在你的本地install
less
,sass
,styl
的node module。
script 也可以直接引用其他后缀的文件,包括.ts
,.vue
<script src="index.ts"></script>
<script src="index2.vue"></script>
<script src="index3.js"></script>
而且这些文件默认会已umd的形式导出。当然这些还是不需要任何配置
有时候我们只是想简单的试一试这些小组件,并不想构建一个特别庞大的webpack配置。因为这个初衷,我才编写了wakeup。
使用它,你只需要像最初的前端去编写代码
**粗体** _斜体_ [链接](http://example.com) `代码` - 列表 > 引用
。你还可以使用@
来通知其他用户。