使用 Ember-CLI 实时加载;仅重新加载更改的资源



我习惯于用Grunt或Gulp构建资产编译系统。使用Gulp的livereload和Chrome livereload插件,我有一个非常可爱的系统,它可以监视某些文件类型的更改,并仅重新加载已更改的文件。使用 ember-cli,当我更改 CSS 文件时,它只是重新加载整个页面,而不仅仅是重新加载 CSS 文件。当我尝试设计一个深度嵌套的过程时,这会很痛苦。关于如何使其与 Ember CLI 正确配合使用的任何想法/想法?

我相信

这仍然是 Ember CLI 正在进行的工作,并计划在未来发布,或者取决于 Broccoli 中的修复。请参阅 https://github.com/stefanpenner/ember-cli/issues/2371

我为解决这个问题所做的可能并不理想,但我最终使用 grunt,并使用 shell 命令运行 ember build ,将输出复制到另一台服务器(在我的例子中是 IIS 快递)提供的不同目录,然后手动监视我的文件。

这是我的咕噜咕噜文件中的片段。我相信你可以使用Gulp完成同样的工作。

    shell: {
        prod: {
            command: 'ember build --environment production'
        },
        dev: {
            command: 'ember build'
        }
    },
    copy: {
        dev: {
            files: [{
                src: '**',
                dest: '../Server/Content/js',
                cwd: 'dist/content/js',
                expand: true
            }, {
                src: '**',
                dest: '../Server/content/css',
                cwd: 'dist/content/css',
                expand: true
            }, {
                src: 'dist/index.html',
                dest: '../Server/Views/Home/Root.cshtml'
            }]
        }
    },
    watch: {
        dev: {
            files: [
                'app/**/*.js', 'app/**/*.hbs'
            ],
            tasks: ['_buildDev'],
            options: {
                livereload: true
            }
        },
        less: {
            files: [
                'app/**/*.less'
            ],
            tasks: ['shell:dev', 'copy:dev']
        },
        css: {
            files: [
                '../Server/Content/css/**/*'
            ],
            options: {
                livereload: true
            }
        }
    }

官方支持正在开发中,同时尝试这个余烬插件 https://www.npmjs.com/package/ember-cli-styles-reloader

相关内容

  • 没有找到相关文章