yeoman webapp scaffold live reload working但不刷新css

时间:2015-09-17 01:13:57

标签: node.js npm yeoman yeoman-generator livereload

npm,bower,grunt等所有新手。我得到了yeoman使用webapp生成器和实时重新加载工作正常的HTML页面。我的scss文件编译成.tmp文件夹,更改按原样运行,但我必须手动按f5或刷新才能看到css更改。

如果我保存相应的html文件,则css会更新。当我保存.scss文件时,我必须手动更新它。 Javascript在保存js文件时也没有更新,但在保存index.html时更新。

我在ubuntu 14上。这是我的grunt文件的一部分。

  watch: {
  bower: {
    files: ['bower.json'],
    tasks: ['wiredep']
  },
  babel: {
    files: ['<%= config.app %>/scripts/{,*/}*.js'],
    tasks: ['babel:dist']
  },
  babelTest: {
    files: ['test/spec/{,*/}*.js'],
    tasks: ['babel:test', 'test:watch']
  },
  gruntfile: {
    files: ['Gruntfile.js']
  },
  sass: {
    files: ['<%= config.app %>/styles/{,*/}*.{scss,sass}'],
    tasks: ['sass:server', 'postcss']
  },
  styles: {
    files: ['<%= config.app %>/styles/{,*/}*.css'],
    tasks: ['newer:copy:styles', 'postcss']
  }
},

browserSync: {
  options: {
    notify: false,
    background: true
  },
  livereload: {
    options: {
      files: [
        '<%= config.app %>/{,*/}*.html',
        '.tmp/styles/{,*/}*.css',
        '<%= config.app %>/images/{,*/}*',
        '.tmp/scripts/{,*/}*.js'
      ],
      port: 9000,
      server: {
        baseDir: ['.tmp', config.app],
        routes: {
          '/bower_components': './bower_components'
        }
      }
    }
  },
  test: {
    options: {
      port: 9001,
      open: false,
      logLevel: 'silent',
      host: 'localhost',
      server: {
        baseDir: ['.tmp', './test', config.app],
        routes: {
          '/bower_components': './bower_components'
        }
      }
    }
  },
  dist: {
    options: {
      background: false,
      server: '<%= config.dist %>'
    }
  }
},

我对这一切都很陌生,但我花了一整天的时间试图解决这个问题并且被烧毁了。很感谢任何形式的帮助。谢谢

0 个答案:

没有答案