在前端开发中，Grunt 是一款强大的任务自动化工具，能够帮助我们高效完成代码压缩、图片优化等繁琐工作。今天就以一个简单的实例，带你快速上手 Grunt 的使用！✨

首先，确保你的项目目录已经初始化为 npm 项目（`npm init -y`）。接着，安装 Grunt 及相关插件：

```bash

npm install grunt --save-dev

npm install grunt-contrib-uglify grunt-contrib-cssmin --save-dev

```

接下来，在项目根目录下创建 `Gruntfile.js` 文件，并配置任务。例如，压缩 JavaScript 和 CSS 文件：

```javascript

module.exports = function(grunt) {

grunt.initConfig({

uglify: {

options: { mangle: false },

build: {

src: 'src/js/main.js',

dest: 'dist/js/main.min.js'

}

},

cssmin: {

target: {

files: [{

expand: true,

cwd: 'src/css/',

src: ['.css'],

dest: 'dist/css/',

ext: '.min.css'

}]

}

}

});

grunt.loadNpmTasks('grunt-contrib-uglify');

grunt.loadNpmTasks('grunt-contrib-cssmin');

grunt.registerTask('default', ['uglify', 'cssmin']);

};

```

保存后运行 `grunt` 命令，Grunt 就会自动完成任务！🚀

通过这种方式，你不仅提升了工作效率，还能让代码更加整洁规范。快来试试吧！💪