前端開發小工具wakeup

時間 2019-12-06

標籤前端開發工具 wakeup 简体版

原文原文鏈接

wakeup是我最近開發的一個小工具，目的是爲了讓咱們更快捷的使用須要編譯的代碼。html

當咱們編寫了一個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只能使用瀏覽器支持的語法去編寫代碼。vue

可是有了wakeup咱們能夠編寫任何代碼在index.js，好比說引用一個nodejs庫等等node

import moment from 'moment'
export defalut {
    mm:moment
}

只要安裝wakeup，接着運行wakeup watch，wakeup 會幫助你自動編譯index.js並開啓一個服務，承載這個htmlwebpack

你不用配置，就獲得了一個擁有babel，commonjs，esm的環境。git

固然，wakeup還支持對stylesheet的支持github

<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,stylweb

固然，這些依然不須要配置，可是可能須要在你的本地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。

使用它，你只須要像最初的前端去編寫代碼

相關標籤/搜索

每日一句

每一个你不满意的现在，都有一个你没有努力的曾经。