Question

我是Grunt的新手。紧跟this tutorial。

我有一段时间想让Grunt编译Sass。运行grunt sass时，我不断得到以下信息：

Loading "sass.js" tasks...ERROR
>> SyntaxError: Unexpected token (
Warning: Task "sass" not found. Use --force to continue.

Aborted due to warnings.

节点：v6.11.0，
npm：v6.4.1，
grunt cli：v1.3.2

package.json：

{
  "name": "yb",
  "version": "1.0.0",
  "description": "yb site build",
  "main": "src/js/main.js",
  "dependencies": {},
  "devDependencies": {
    "grunt": "^1.0.3",
    "grunt-contrib-concat": "^1.0.1",
    "grunt-sass": "^3.0.2",
    "node-sass": "^4.10.0"
  },
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "author": "Scott",
  "license": "ISC"
}

Gruntfile.js

module.exports = function(grunt) {

   // Configuration
   grunt.initConfig({
      concat: {
         js: {
            src: ['src/**/*.js'],
            dest: 'assets/js/main.js'
         },
         css: {
            src: ['src/**/*.css'],
            dest: 'assets/css/main.css'
         }
      },

      sass: {
         build: {
            files: [{
               src: 'src/sass/test.scss',
               dest: 'assets/css/test.css'
            }]
         }
      }

   });

   // Load Plugins
   grunt.loadNpmTasks('grunt-contrib-concat');
   grunt.loadNpmTasks('grunt-sass');

   // Register Tasks
   grunt.registerTask('concat-js', ['concat:js']);
   grunt.registerTask('concat-css', ['concat:css']);
};

grunt-sass docs提供了不同的配置（我也尝试过），但是仍然无法编译。

据我所知，一切都已安装。我在这里找不到要离开的地方。有什么想法吗？

谢谢！

Answer 1

使用ruby -v检查ruby（安装[ruby] [1]）
使用sudo gem install sass安装Sass（安装[sass] [2]）

设置Grunt任务并运行grunt convert-sass

// Load Grunt
module.exports = function (grunt) {
  grunt.initConfig({
    pkg: grunt.file.readJSON('package.json'),

    // Tasks
  concat: {
     js: {
        src: ['src/**/*.js'],
        dest: 'assets/js/main.js'
     },
     css: {
        src: ['src/**/*.css'],
        dest: 'assets/css/main.css'
     }
  },

    sass: {
      dist: {
        options: {
          sourcemap: 'none'
        },
        files: [{
          expand: true,
          cwd: 'src/sass',
          src: ['**/*.scss'],
          dest: 'assets/css',
          ext: '.css'
      }]
      }
    }

  });

  // Load plugins
  grunt.loadNpmTasks('grunt-contrib-sass');
  grunt.loadNpmTasks('grunt-sass');
  grunt.loadNpmTasks('grunt-contrib-concat');

   // Register Tasks
  grunt.registerTask('concat-js', ['concat:js']);
  grunt.registerTask('concat-css', ['concat:css']);
  grunt.registerTask('convert-sass', 'sass');

};

无法使用Grunt编译Sass

1 个答案: