Usemin不能替换HTML中的参考块 [英] Usemin not replacing reference blocks in HTML

问题描述

我可以正确地看到css和js文件连接，加速并复制到正确的文件夹。尽管如此，最后一步是usemin替换html文件中的块和图像，但由于某种原因，它并不起作用。

Gruntfile.js：

  useminPrepare：{
 html：'<％= yeoman.app％> /index.html'，
选项：{
 dest：'<％= yeoman。 dist％>'
} 
}，
 
 //根据rev和useminPrepare配置执行重写
 usemin：{
 css：[' <％= yeoman.dist％> / styles / {，* /} *。css']，
 html：['<％= yeoman.dist％> / {，* /} *。 html']，
 options：{
 assetsDirs：['<％= yeoman.dist％> / images'，'<％= yeoman.dist％> / styles'，'< ;％= yeoman.dist％> / scripts'] 
} 
}，
  

在Html中我有：

 <！ -  build：css styles / main.css  - > 
< link rel =stylesheethref =Styles / main.css> 
< link rel =stylesheethref =Shared / Styles / default.css> 
< link rel =stylesheethref =Shared / Styles / default.date.css> 
< link rel =stylesheethref =Shared / Styles / default.time.css> 
<！ -  endbuild  - > 
  

建筑时的输出显示：

  [1m以HTML格式处理 -  dist / index.html [22m 
更新HTML以引用我们的concat / min / revved脚本文件
使用新的css文件名更新HTML 
使用新的img文件名更新HTML 
使用data-main标签更新HTML 
使用data- *标签更新HTML 
使用背景图片更新HTML，一些内联样式
使用锚图像更新HTML 
使用输入
  

更新HTML

dist中的文件结构：

   -  dist 
 |  -  index.html 
 |  - 样式
 |  -  146eba12.main.css 
 |  - 脚本
 |  -  ... 
 |  - 图片
 |  -  ... 
  code> 

这一直令我疯狂，我无法弄清楚原因。任何帮助将不胜感激。



更新：在进一步的开发中，我不知道为什么，html中的块现在被一行指向连接文件，但它不会预先加入在加速过程中添加的散列。所以它的确如下：



 < link rel =stylesheethref =styles / main.css/> 
  

而不是：



 < link rel =stylesheethref =styles / b64b6f59.main.css/> 
  




解决方案

我有完全相同的问题，并且偶然发现了这个问题在我的搜索。我尝试了一切（1000配置选项），但没有任何工作。 （然而，concat，minifying，revving，keep working）



然后在搜索和搜索后，我找到了一个简单的解决方案：将您的行结尾从Unix更改为Dos / Windows格式。 / p>



解决了这个问题。

I can see css and js files correctly getting concatenated, revved and copied to the correct folder. The last step though, being usemin replacing the blocks and images in html file, is not working for some reason. The image references in the css file do get replaced.

Gruntfile.js:

useminPrepare: {
  html: '<%= yeoman.app %>/index.html',
  options: {
    dest: '<%= yeoman.dist %>'
  }
},

// Performs rewrites based on rev and the useminPrepare configuration
usemin: {
  css: ['<%= yeoman.dist %>/styles/{,*/}*.css'],
  html: ['<%= yeoman.dist %>/{,*/}*.html'],
  options: {
    assetsDirs: ['<%= yeoman.dist %>/images', '<%= yeoman.dist %>/styles', '<%= yeoman.dist %>/scripts']
  }
},

in Html I have:

<!-- build:css styles/main.css -->
<link rel="stylesheet" href="Styles/main.css">
<link rel="stylesheet" href="Shared/Styles/default.css">
<link rel="stylesheet" href="Shared/Styles/default.date.css">
<link rel="stylesheet" href="Shared/Styles/default.time.css">
<!-- endbuild -->

The output when building says:

[1mProcessing as HTML - dist/index.html[22m
Update the HTML to reference our concat/min/revved script files
Update the HTML with the new css filenames
Update the HTML with the new img filenames
Update the HTML with data-main tags
Update the HTML with data-* tags
Update the HTML with background imgs, case there is some inline style
Update the HTML with anchors images
Update the HTML with reference in input

The file structure in dist:

– dist
   |– index.html
   |– styles
      |– 146eba12.main.css
   |– scripts
     |– ...
   |– images
     |– ...

This has been driving me crazy and I cannot figure out why. Any assistance will be highly appreciated.

UPDATE: In a further development, and I don't know why, the blocks in html now are replaced by one line pointing to the concatenated file but it does not prepend the hash added during revving. So it does:

<link rel="stylesheet" href="styles/main.css"/>

Rather than:

<link rel="stylesheet" href="styles/b64b6f59.main.css"/>

解决方案

I had exactly the same problem and stumbled upon this question in my search. I tried everything (1000 config options) but nothing worked. (however concat, minifying, revving, kept working)

Then after searching and searching I found an easy solution: Change your line endings from Unix to Dos/Windows format.

That fixed this problem for me.

这篇关于Usemin不能替换HTML中的参考块的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！