Gruntjs 无法使用Grunt加载css文件 [在此处输入图像描述][1] 我无法使用gruntfile.js加载css文件 下面是我的Grunfile文件 "严格使用",； module.exports=函数（grunt）{ 要求（“时间咕噜”）（咕噜）； //自动加载所需的Grunt任务 要求（“jit-grunt”）（grunt）； grunt.initConfig({ pkg:grunt.file.readJSON（'package.json'）， jshint:{ 选项：{ jshintrc:“.jshintrc”， 记者：require（'jshint-style'） }, 全部：{ src:[ “Gruntfile.js”， 'app/scripts/{，*/}*.js' ] } }, 副本：{ 地区：{ cwd:“应用程序”， src:['**'，'！style/***.css'，'！scripts/***.js']， 目的地：“距离”， 扩展：正确 }, }, 清洁：{ 建造：{ src:['dist/'] } }, 使用准备：{ html:'app/index.html'， 选项：{ 目的地：“距离” } }, //海螺 康卡特：{ 选项：{ 分隔符：'；' }, //dist配置由useminPrepare提供 地区：{} }, 康卡特：{ 选项：{ 分隔符：'；' }, //dist配置由useminPrepare提供 地区：{} }, //丑陋的 丑陋的：{ //dist配置由useminPrepare提供 地区：{} }, cssmin：{ 地区：{} }, 文件版本：{ 选项：{ 编码：“utf8”， 算法：“md5”， 长度：20 }, 发布：{ //filerev:release hash（md5）所有资产（图像、js和css） //在dist目录中 档案：[{ src:[ 'dist/scripts/*.js'， “dist/styles/*.css”， ] }] } }, //乌斯敏 //将所有资产替换为html和css文件中的更新版本。 //options.assetDirs包含用于查找资产的目录 //根据它们的相对路径 usemin：{ html:['dist/html/*.html']， css:['dist/styles/*.css']， 选项：{ 资产目录：['dist'，'dist/样式'] } }, 观察：{ 副本：{ 文件：['app/**'、'！app/***.css'、'！app/***.js']， 任务：[“构建”] }, 脚本：{ 文件：['app/scripts/app.js']， 任务：[“构建”] }, 风格：{ 文件：['app/styles/app.css']， 任务：[“构建”] }, 利弗雷罗德：{ 选项：{ livereload:' }, 档案：[ 'app/{，*/}*.html'， “.tmp/styles/{，*/}*.css”， 'app/images/{，*/}{png，jpg，jpeg，gif，webp，svg}' ] } }, 连接：{ 选项：{ 港口：9000， //将此更改为“0.0.0.0”以从外部访问服务器。 主机名：“localhost”， 利弗雷罗德：35729 }, 地区：{ 选项：{ 开放：是的， 基数：{ 路径：“dist”， 选项：{ 索引：“index.html”， } } } } }, }); grunt.registerTask（'build'[ “干净”， “jshint”， “使用MinPrepare”， "海螺",， “cssmin”， "丑",， “复制”， “filerev”， “usemin” ]); registerTask（'serve'、['build'、'connect:dist'、'watch']）； registerTask（'default'，['build']）； }; 下面是我的文件夹结构 [在此处输入图像描述][2]

我试图加载网页，但它显示平面html没有任何css。 有人能告诉我需要做什么来解决这个问题吗？ 当我试图使用grunt服务加载文件时，它显示了404错误

[enter image description here][1]


I am not able to load the css files using gruntfile.js

Below is my gruntfile

'use strict';
module.exports = function(grunt) {
require('time-grunt')(grunt);


// Automatically load required Grunt tasks
require('jit-grunt')(grunt);
grunt.initConfig({
  pkg: grunt.file.readJSON('package.json'),
  jshint: {
    options: {
      jshintrc: '.jshintrc',
      reporter: require('jshint-stylish')
    },

    all: {
      src: [
        'Gruntfile.js',
        'app/scripts/{,*/}*.js'
      ]
    }
  },
  copy: {
      dist: {
        cwd: 'app',
        src: [ '**','!styles/**/*.css','!scripts/**/*.js' ],
        dest: 'dist',
        expand: true
      },
    },
    clean: {
        build:{
            src: [ 'dist/']
        }
    },
     useminPrepare: {
        html: 'app/index.html',
        options: {
            dest: 'dist'
        }
    },
      // Concat
    concat: {
        options: {
            separator: ';'
        },
        // dist configuration is provided by useminPrepare
        dist: {}
    },
     concat: {
        options: {
            separator: ';'
        },
        // dist configuration is provided by useminPrepare
        dist: {}
    },
      // Uglify
    uglify: {
        // dist configuration is provided by useminPrepare
        dist: {}
    },
    cssmin: {
        dist: {}
    },
     filerev: {
        options: {
            encoding: 'utf8',
            algorithm: 'md5',
            length: 20
        },
        release: {
            // filerev:release hashes(md5) all assets (images, js and css )
            // in dist directory
            files: [{
                src: [
                    'dist/scripts/*.js',
                    'dist/styles/*.css',
                ]
            }]
        }
    },
      // Usemin
      // Replaces all assets with their revved version in html and css files.
      // options.assetDirs contains the directories for finding the assets
      // according to their relative paths
    usemin: {
        html: ['dist/html/*.html'],
        css: ['dist/styles/*.css'],
        options: {
            assetsDirs: ['dist', 'dist/styles']
        }
    },
       watch: {
        copy: {
            files: [ 'app/**', '!app/**/*.css', '!app/**/*.js'],
            tasks: [ 'build' ]
        },
        scripts: {
            files: ['app/scripts/app.js'],
            tasks:[ 'build']
        },
        styles: {
            files: ['app/styles/app.css'],
            tasks:['build']
        },
        livereload: {
            options: {
                livereload: '<%= connect.options.livereload %>'
            },
            files: [
                'app/{,*/}*.html',
                '.tmp/styles/{,*/}*.css',
                'app/images/{,*/}*.{png,jpg,jpeg,gif,webp,svg}'
            ]
      }
    },
     connect: {
      options: {
        port: 9000,
        // Change this to '0.0.0.0' to access the server from outside.
        hostname: 'localhost',
        livereload: 35729
      },
      dist: {
        options: {
          open: true,
          base:{
               path: 'dist',
            options: {
                index: 'index.html',
            }
          }
        }
      }
    },
});

grunt.registerTask('build', [
    'clean',
    'jshint',
    'useminPrepare',
    'concat',
    'cssmin',
    'uglify',
    'copy',
    'filerev',
    'usemin'
]);
grunt.registerTask('serve',['build','connect:dist','watch']);
grunt.registerTask('default',['build']);
};

Below is my folder structure
[enter image description here][2]