Grunt/less @imports 未导入到输出文件中 css

Question

输出的main.css文件中没有导入我的Imports，通常main.css应该用bootstrap的css填充，fontawesome, animate etecetera...

但他们是这样出现的@import "bootstrap.min.css";@import "font-awesome.min.css";@import "animate.css";...

这是我的gruntfile.js

module.exports = function (grunt)
{
    grunt.loadNpmTasks('grunt-contrib-jshint');
    grunt.loadNpmTasks('grunt-contrib-watch');
    grunt.loadNpmTasks('grunt-contrib-uglify');
    grunt.loadNpmTasks('grunt-contrib-less');

    var userConfig = require( './build.config.js' );

    var taskConfig = {
        watch: {
            styles: {
                files: ['<%= less_dir %>/**/*.less'], // which files to watch
                tasks: [ 'less'],
                options: {
                    nospawn: true
                }
            }
        },

        less: {
            development: {
                options: {
                    compress: true,
                    yuicompress: true,
                    optimization: 2
                },
                files: {
                    "<%= css_dir %>/main.css": "<%= less_dir %>/main.less"
                }
            }
        }
    };


    grunt.initConfig( grunt.util._.extend( taskConfig, userConfig ) );

};

我的main.less

/* - Imports - */
@import "bootstrap.min.css";
@import "font-awesome.min.css";
@import "animate.css";
@import "variables";

Answer 1

好的，我修好了！我要回答我自己的问题所以如果你随机的陌生人有同样的问题你只需要将文件名从 *.css 更改为 *.less 实际触发 grunt-contrib-less 导入你的样式表

所以 bootstrap.min.css 到 bootstrap.min.less / 等...

Grunt/less @imports 未导入到输出文件中 css

Grunt/less @imports are not imported in the Outputfile css

import

less

gruntjs