如何安装grunt以及如何使用它构建脚本 [英] How to install grunt and how to build script with it

问题描述

您好，我正在尝试在Windows 7 64位上安装Grunt。我已经使用命令安装了Grunt

  npm install -g grunt 
 npm install -g grunt-cli 
  

但现在如果我尝试执行 grunt init ，它是抛出一个错误 -

无法找到有效的Gruntfile。有关如何配置grunt的更多信息，请参阅入门
指南：
http：// gruntjs.com/getting-started 致命错误：无法找到
Gruntfile。

但是当我看在我的系统的grunt文件夹里有 Gruntfile.js 。有人可以请指导我如何正确安装此咕噜声以及如何使用咕噜声编写内置脚本。我有一个HTML页面和Java脚本，如果我想用Grunt构建脚本，我该怎么做？ 安装GruntJS

在这里构建的步骤是：

1. 确保你已经安装了你的 package.json 或设置新的：
   
   

     npm init 
     




2. 将Grunt CLI安装为全局：
   
   

     npm install -g grunt-cli 
     




3. 在您的本地项目中安装Grunt：
   
   

     npm install grunt --save-dev 
     




4. 在您的构建过程中安装您可能需要的任何Grunt模块。为了这个例子，我将添加Concat模块来合并文件：
   
   

     npm install grunt-contrib-concat --save -dev 
     




5. 现在您需要设置 Gruntfile.js 这将描述你的构建过程。对于这个示例，我只是在中将两个JS文件 file1.js 和 file2.js js 文件夹并生成 app.js ：

     module.exports = function（grunt）{
    
    //项目配置。 
    grunt.initConfig（{
    concat：{
   options：{separator：;}，
   build：{
   src ：[js / file1.js，js / file2.js]，
   dest：js / app.js
   } 
   } 
   }） ; 
    
    //载入所需模块
    grunt.loadNpmTasks（'grunt-contrib-concat'）; 
    
    //任务定义
    grunt.registerTask（'default'，['concat']）; 
   }; 
     




6. 现在您可以通过以下命令来运行构建过程：

     grunt 
     


ol>



我希望这可以让你知道如何使用GruntJS构建。



注意：



您可以使用 grunt-init 用于创建 Gruntfile.js ，如果您想要基于向导的创建而不是步骤5的原始编码。





请执行以下步骤：



  npm install -g grunt-init 
 git clone https：// github .com / gruntjs / grunt-init-gruntfile.git〜/ .grunt-init / gruntfile 
 grunt-init gruntfile 
  

对于Windows用户：如果您使用cmd.exe，则需要将〜/ .grunt-init / gruntfile 更改为 ％USERPROFILE％\.grunt-init\ 。 PowerShell将正确识别〜。




Hi I'm trying to install Grunt on Windows 7 64 bit. I have installed Grunt using commands

 npm install -g grunt
 npm install -g grunt-cli

but now if I try to do grunt init, it is throwing me an error -

A valid Gruntfile could not be found. Please see the getting started guide for more information on how to configure grunt: http://gruntjs.com/getting-started Fatal error: Unable to find Gruntfile.

But when I look inside the grunt folder on my system the Gruntfile.js is there. can someone please guide me how to install this grunt properly and how to write built Script using the grunt. I have one HTML page and java script if i wants built a script using Grunt how can i do it?

解决方案

To setup GruntJS build here is the steps:

1. Make sure you have setup your package.json or setup new one:

   npm init
   

2. Install Grunt CLI as global:

   npm install -g grunt-cli
   

3. Install Grunt in your local project:

   npm install grunt --save-dev
   

4. Install any Grunt Module you may need in your build process. Just for sake of this sample I will add Concat module for combining files together:

   npm install grunt-contrib-concat --save-dev
   

5. Now you need to setup your Gruntfile.js which will describe your build process. For this sample I just combine two JS files file1.js and file2.js in the js folder and generate app.js:

   module.exports = function(grunt) {
   
       // Project configuration.
       grunt.initConfig({
           concat: {
               "options": { "separator": ";" },
               "build": {
                   "src": ["js/file1.js", "js/file2.js"],
                   "dest": "js/app.js"
               }
           }
       });
   
       // Load required modules
       grunt.loadNpmTasks('grunt-contrib-concat');
   
       // Task definitions
       grunt.registerTask('default', ['concat']);
   };
   

6. Now you'll be ready to run your build process by following command:

   grunt
   

I hope this give you an idea how to work with GruntJS build.

NOTE:

You can use grunt-init for creating Gruntfile.js if you want wizard-based creation instead of raw coding for step 5.

To do so, please follow these steps:

npm install -g grunt-init
git clone https://github.com/gruntjs/grunt-init-gruntfile.git ~/.grunt-init/gruntfile
grunt-init gruntfile

For Windows users: If you are using cmd.exe you need to change ~/.grunt-init/gruntfile to %USERPROFILE%\.grunt-init\. PowerShell will recognize the ~ correctly.

这篇关于如何安装grunt以及如何使用它构建脚本的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！