build - Grunt 更改 index.html 参考

Question

使用 grunt 时，可以更改 html 文件中的引用。

例如，作为构建过程的一部分，我将文件名从 style.css 更改为 style.min.css。

我想做的是在我的 index.html 文件中更改对样式表的引用以使用缩小版本。

Answer 1

是的，看看grunt-usemin。自述文件非常详尽。:)

https://github.com/yeoman/grunt-usemin

Answer 2

另一种可能的解决方案，它避免在你的 html 标记中定义块注释，是安装名为：grunt-text-replace的插件

通过 npm 安装插件：

$ npm install grunt-text-replace --save-dev

然后将以下内容添加到您的Gruntfile：

Gruntfile.js：

grunt.initConfig({

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

    /* UPDATES CSS SRC REFERENCED IN YOUR THE HTML FILE */
    replace: {
        cssLink: {
            src: ['./src/index.html'], //<--- The path to your html file
            overwrite: true,
            replacements: [{
                // Subsitute src="css/ below with the path to your CSS file.
                from: 'src="css/style.css',
                // Subsitute src="css/ above with the path to your minified CSS file.
                to: 'src="css/style.min.css'
            }]
        }
    }

});

grunt.loadNpmTasks('grunt-text-replace');

grunt.registerTask('default', [
    'replace:cssLink'
]);

};