我使用Yeoman进行了角度设置。在我的main.html
(加载到index.html上的 View )下,我在样式文件夹中添加了一个引用的css文件。
我用构建注释将其包围起来,以便可以在最小化的同时通过咕be咕picked地拾取它:
<!-- build:css({.tmp,app}) styles/calendar.css -->
<link rel="stylesheet" href="styles/fullcalendar.css" />
<!-- endbuild -->
但是,当我使用grunt(具有基本的yeoman grunt配置)进行构建时,似乎没有创建calendar.css文件。我怀疑这可能是因为main.html文件位于views/main.html中。
从我的 Grunt 文件中:
usemin: {
html: ['<%= yeoman.dist %>/{,*/}*.html'],
css: ['<%= yeoman.dist %>/styles/{,*/}*.css'],
options: {
dirs: ['<%= yeoman.dist %>']
}
},
...
cssmin: {
// By default, your `index.html` <!-- Usemin Block --> will take care of
// minification. This option is pre-configured if you do not wish to use
// Usemin blocks.
// dist: {
// files: {
// '<%= yeoman.dist %>/styles/main.css': [
// '.tmp/styles/{,*/}*.css',
// '<%= yeoman.app %>/styles/{,*/}*.css'
// ]
// }
// }
},
它不会在views目录中查找。我怀疑我使用的工作流程不正确。
如何包含特定于 View 的CSS文件?
另外,cssmin块中的注释是什么意思?
谢谢!
最佳答案
我有答案!
由于您使用的是自定义工作流程,因此Gruntfile.js
中需要更多配置。 (忽略是否已经完成这些操作)。
首先,需要更新复制任务,以将app/views
目录复制到dist/views
。这很容易解决:
copy: {
dist: {
files: [{
expand: true,
dot: true,
cwd: '<%= yeoman.app %>',
dest: '<%= yeoman.dist %>',
src: [
'*.{ico,png,txt}',
'.htaccess',
'images/{,*/}*.{webp,gif}',
'styles/fonts/*',
'views/*'
]
}]
},
// ...
}
酷酷。现在,
useminPrepare
(在复制您的内容之前运行)也需要知道views目录。useminPrepare: {
options: {
dest: '<%= yeoman.dist %>'
},
html: [
'<%= yeoman.app %>/index.html',
'<%= yeoman.app %>/views/*.html'
]
},
呜呜呜呜!就是这样!
让我知道您是否被卡在任何地方!
关于gruntjs - 使用Yeoman工作流程在何处添加CSS文件,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/18176308/