Question

我不知道为什么但是这段代码在一段时间后停止了工作。它正在修改代码，但不添加任何供应商前缀。我还想将其他文件添加到css中，例如normalize，但它也没有用。这是代码：

  grunt.initConfig({
pkg: grunt.file.readJSON('package.json'),

uglify: {
  dist: {
    options: {
      banner: '/*! <%= pkg.name %> <%= pkg.version %> filename.min.js <%= grunt.template.today("yyyy-mm-dd h:MM:ss TT") %> */\n',
    },
    files: {
      'js/scripts.min.js' : [

      ]
    }
  },
  dev: {
    options: {
      banner: '/*! <%= pkg.name %> <%= pkg.version %> filename.js <%= grunt.template.today("yyyy-mm-dd h:MM:ss TT") %> */\n',
      beautify: true,
      compress: false,
      mangle: false
    },
    files: {
      'js/scripts.js' : [

      ]
    }
  }
},
sass: {
  dist: {
    options: {
      compass: true,
      style: 'expanded'
    },
    files: [{
      expand: true,
      cwd: 'sass',
      src: [
        'style.scss'
      ],
      dest: 'css',
      ext: '.css'
    }]
  }
},
watch: {
  styles: {
    files: ['**/*.scss'],
    tasks: ['style']
  }
},
postcss: {
  options: {
    map: {
      inline: false, // save all sourcemaps as separate files...
      annotation: 'css/maps/' // ...to the specified directory
    },

    processors: [
      require('pixrem')(), // add fallbacks for rem units
      require('autoprefixer')({browsers: ['last 3 versions']}), // add vendor prefixes
      require('cssnano')() // minify the result
    ]
  },
  dist: {
    src: 'css/style.css',
    dest: 'css/styles.min.css'
  }

}});

编辑，我已将整个grunt文件包含在代码段中。

＆＃13;

module.exports = function(grunt) {

  // Project configuration.
  grunt.initConfig({
    pkg: grunt.file.readJSON('package.json'),

    uglify: {
      dist: {
        options: {
          banner: '/*! <%= pkg.name %> <%= pkg.version %> filename.min.js <%= grunt.template.today("yyyy-mm-dd h:MM:ss TT") %> */\n',
        },
        files: {
          'js/scripts.min.js' : [

          ]
        }
      },
      dev: {
        options: {
          banner: '/*! <%= pkg.name %> <%= pkg.version %> filename.js <%= grunt.template.today("yyyy-mm-dd h:MM:ss TT") %> */\n',
          beautify: true,
          compress: false,
          mangle: false
        },
        files: {
          'js/scripts.js' : [

          ]
        }
      }
    },
    sass: {
      dist: {
        options: {
          compass: true,
          style: 'expanded'
        },
        files: [{
          expand: true,
          cwd: 'sass',
          src: [
            'style.scss'
          ],
          dest: 'css',
          ext: '.css'
        }]
      }
    },
    watch: {
      styles: {
        files: ['**/*.scss'],
        tasks: ['style']
      }
    },
    postcss: {
      options: {
        map: {
          inline: false, // save all sourcemaps as separate files...
          annotation: 'css/maps/' // ...to the specified directory
        },

        processors: [
          require('pixrem')(), // add fallbacks for rem units
          require('autoprefixer')({browsers: ['last 3 versions']}), // add vendor prefixes
          require('cssnano')() // minify the result
        ]
      },
      dist: {
        src: 'css/style.css',
        dest: 'css/styles.min.css'
      }

    }

  });



  grunt.loadNpmTasks('grunt-contrib-uglify');
  grunt.loadNpmTasks('grunt-contrib-sass');
  grunt.loadNpmTasks('grunt-contrib-watch');
  grunt.loadNpmTasks('grunt-postcss');

  // Default task(s).
  grunt.registerTask('style', [
    'sass',
    'postcss'
  ]);

  // Default task(s).
  grunt.registerTask('default', [
    'uglify:dist',
    'sass',
    'postcss',
    'watch'
  ]);

};

＆＃13;

Answer 1

我认为问题可能是，它不支持最后3个版本指令，这就是为什么它不添加任何内容。

以下是autoperfixer处理器可能解释的可能参数的参考：https://github.com/ai/browserslist

尝试使用类似的东西：

last 2 versions

希望这有帮助，因为其他一切似乎都是正确的。

为什么我的grunt autoprefixer不起作用？

1 个答案: