美文网首页前端开发那些事程序员
前端 | 一些实用的npm库

前端 | 一些实用的npm库

作者: 重学前端MDN | 来源:发表于2017-11-25 18:56 被阅读975次
    nodejs.png

    dependencies

    1. whatwg-fetch

    有些浏览器不支持fetch API,可以使用这个polyfill;fetch-ie8主要支持的是IE8浏览器使用Fetch API。

    安装:npm install whatwg-fetch --save or bower install fetch
    使用:
    在webpack中使用: entry: ['whatwg-fetch', ...]
    在js文件中引入 import 'whatwg-fetch'

    2. qrcode

    用于将一些URL、文字、emojis等生成二维码,并将二维码保存成图片。

    安装:npm install qrcode --save or bower install qrcode
    使用:

    var  QRCode = require('qrcode');
    QRCode.toDataURL(url, function (err, url) {});
    

    3. js-cookie

    顾名思义是操作cookie的,有了这个库让我们对cookie进行增删改查方便了很多。
    安装:npm install js-cookie --save or bower install js-cookie
    使用:

    import Cookie from 'js-cookie';
    Cookies.set('name', 'sherry', { expires: 7, path: '' });
    

    4.cpr

    用来将一个文件夹的文件拷贝到另一个文件夹。
    安装: npm install cpr --save
    使用:

    var cpr = require('cpr');
    //or
    var cpr = require('cpr').cpr;
    
    cpr('/path/from', '/path/to', {
        deleteFirst: true, //Delete "to" before
        overwrite: true, //If the file exists, overwrite it
        confirm: true //After the copy, stat all the copied files to make sure they are there
    }, function(err, files) {
        //err - The error if any (err.list might be available with an array of errors for more detailed information)
        //files - List of files that we copied
    });
    
    

    5. ua-parser-js

    这个库主要用于获取浏览器的一些信息。
    安装: npm install ua-parser-js --save
    使用:

    var parser = require('ua-parser-js');
    var parser = new UAParser();
    var os = parser.getOS().name;
    var browser = parser.getBrowser().name;
    var brover = parser.getBrowser().major;
    

    6.[nprogress] (https://www.npmjs.com/package/nprogress)

    devDependencies

    1. ora

    screenshot.gif
    如图所以,在打包编译的时候可以用这个库,图中转动的loading图案就是这个库的效果。这在编译的时候相当于一种反馈,不至于不知道发生了什么。
    安装:npm install --save ora
    使用:
    const ora = require('ora');
     
    const spinner = ora('Loading unicorns');
    spinner.start();
    ......
    spinnner.stop();
    

    2.shelljs

    有了这个库,你可以在其他平台(比如Windows/Linux/OS X)使用Unix平台的shell命令。
    安装:npm install [-g] shelljs
    使用:

    var shell = require('shelljs');
    // Copy files to release dir 
    shell.rm('-rf', 'out/Release');
    shell.cp('-R', 'stuff/', 'out/Release');
     
    // Replace macros in each .js file 
    shell.cd('lib');
    

    3.preprocess

    用来预处理一些HTML,JS文件
    安装: npm install --save preprocess
    使用:

    <head>
      <title>Your App</title>
     
      <!-- @if NODE_ENV='production' -->
      <script src="some/production/lib/like/analytics.js"></script> 
      <!-- @endif -->
     
    </head>
    <body>
      <!-- @ifdef DEBUG -->
      <h1>Debugging mode - <!-- @echo RELEASE_TAG --> </h1>
      <!-- @endif -->
      <p>
      <!-- @include welcome_message.txt -->
      </p>
    </body>
    

    4.log4js

    未完待续。。。

    image.png

    相关文章

      网友评论

        本文标题:前端 | 一些实用的npm库

        本文链接:https://www.haomeiwen.com/subject/hhncbxtx.html