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

你不用配置,就得到了一个拥有babelcommonjsesm的环境。

当然,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。

使用它,你只需要像最初的前端去编写代码


channg
105 声望6 粉丝

« 上一篇
RSA超详细讲解