• grunt的使用方法,环境配置和插件安装


    虽然现在grunt的用的越来越少了,但是插件数量还是相当多的,另外grunt和gulp的使用相当相似;

    grunt需要安装node和npm

    验证node是否安装:node -v

    验证npm是否安装:npm -v

    下面是具体的使用方法:

    1》安装全局的配置环境 npm install -g grunt-cli

    2》安装grunt 在命令行中运行命令 npm install grunt --save-dev (这样输入的是每个项目都必须重新安装grunt) 这里如果想使用全局的就加-g ,如果只是本次项目用grunt,就不用加-g全局

    2》准备两个文件

    a> Gruntfile.js 文件 ---》文件书写按照对应要使用的模块的内容来写

    主任务和模块名称一致

    子任务 / src: 需要压缩的文件路径
    dest :压缩后的路径和名称,没有路径会创建
    只压缩代码,不修改参数的名字 options/ mangle/ Default:{} 默认是true 混淆参数 false 是不混淆

    运行命令 grunt uglify


    b>配置任务 package.json 文件 关于项目的配置信息文件 记录项目的详细信息

    注意这步必须在安装完grunt后操作

    编辑 package.json 文件有两种方法:
    ①在官网找一个package.json文件复制到编辑器中,进行修改并保存到你操作grunt的文件夹中;
    ②用nodejs命令行创建一个package.json文件:
    在你操作grunt的文件夹中运行命令行,输入npm init 回车,然后会提示你输入一系列信息内容(每次输入信息完成后按回车),信息如下:

    name: (grunt)
    version: (1.0.0)
    description:
    entry point: (Gruntfile.js)
    test command:
    git repository:
    keywords:
    author:
    license: (ISC)

    完成后会显示所有你输入过的信息并提示你填写yes
    信息如下:

    About to write to D:gruntpackage.json:

    {
    "name": "grunt",
    "version": "1.0.0",
    "description": "",
    "main": "Gruntfile.js",
    "dependencies": {
    "grunt": "^1.0.1",
    "grunt-contrib-uglify": "^2.0.0"
    },
    "devDependencies": {},
    "scripts": {
    "test": "echo "Error: no test specified" && exit 1"
    },
    "author": "",
    "license": "ISC"
    }

    Is this ok? (yes) yes

    执行到此步骤环境配置完成,剩下的就是挑选你需要的模块了

    3》下载模块

    在官网找到你需要的模块内容

    官网--插件列表(头部)--选择需要的插件
    注意:
    官方维护的都带星号
    不带星号的都是第三方的插件

    使用插件的步骤:
    ⑴下载插件(模块)
    ⑵配置模块

    每个插件的详解中都有如何下载该模块,首先在你操作grunt的文件夹中运行命令行,然后执行对应下载插件的命令,然后按照插件的说明配置Gruntfile.js文件(注意Gruntfile.js 文件名使唯一的每次只能修改内容)

    转载请注明‘转载于Jason齐齐的博客http://www.cnblogs.com/jasonwang2y60/’

  • 相关阅读:
    【转】return 使用示例
    java基础_二维数组的行和列
    新版SQL授权用户时报错 near 'IDENTIFIED BY '密码' with grant option' at line 1
    GO kafka sarama 生产者 消费者 简单 实现
    Windows 安装kafka
    windows 连接nsq
    reflect: call of reflect.Value.NumField on ptr Value
    django 数据库 mysql 事务 处理
    python 类的继承
    python 中 insert 返回 None
  • 原文地址:https://www.cnblogs.com/jasonwang2y60/p/6034745.html
Copyright © 2020-2023  润新知