人生第一次写文章(nodemon搭配babel)

313 阅读3分钟
    第一次写文章,作为一名前端菜鸡,做的项目不少,一直在写着相似却又不相同的业务代码,今天如此,天天如此,但是对各项技术的理解程度并不深入,所以萌生了写文章的想法,

在为自己的技术做积累的同时,也希望可以让自己的文笔有那么一丢丢的提升,不要再一份报告被打回三次了,希望自己可以坚持下去。 

     在编写node的过程中,发现node中对es6并不是百分百的支持,这让小6怎么能忍的了,虽然咱技术菜,但是也是一个积极向上的有所追求的五好青年呢,有过更好的,怎么还能够心甘情愿的去接受那些‘次的’呢,所以我要变... 

     首先,我们来检测一下到底node对es6是一个怎样的支持情况呢 就是用es-checker这货,执行以下命令 

yarn global add es-checker

 待es-checker安装完毕之后,执行

 es-checker

     等待一系列的反应之后,我们可以得到下面这张amazing的图片,在node 8.10.0版本中,对es6 的支持达到了90%之多,春天还会远吗

     此外,在我们编写node的过程中,没修改一次代码,就要重启一下服务(重新执行以下代码),小6还是个小萌新的时候,为这个事情键盘都按烂好几台了,后因所在qq群与google合作,小6第一次知道程序的世界中竟然还有nodemon这等神器,oh my

     first,执行以下代码

yarn add nodemon

     然后将每次启动服务的命令node index.js 进阶为 nodemon index.js

     接下来的事情呢,就显得那么的合理,妈妈再也不用担心我把键盘按坏了

     但是,但是这样还是不爽有么有,比之前要多了几个字母,嗯,所以,不能白白浪费掉跟google合作的机会,我得到了以下的操作方式

      在package.json中增加以下内容

     这时候你所执行的命令就是

yarn start

     amazing,接下来就是安装babel

yarn add babel-cli --dev

      将babel-cli安装到你的项目目录中,除此之外呢,还需将babel-cli安装到全局变量中

yarn global add babel-cli

      接着在将我们之前的命令改写

      添加这段代码之后,他也有点蒙圈,安装了他干嘛呢?在工作目录下创建一个名字为.babelrc的文件, 文件内容入如下

{ "presets": [  "es2015" ]}

     然后再安装babel-preset-es2015,依然是熟悉的代码

yarn add babel-preset-es2015 --dev

     至此,执行 yarn start,你会看到“这盛世如你所愿”