GRUNT:与sass一起使用时,grunt-postcss无法执行cssnano-如果scss文件很长

如何解决GRUNT:与sass一起使用时,grunt-postcss无法执行cssnano-如果scss文件很长

我正在sass上同时使用gruntpostcss解析器和cssnanowatch. 来解析文件cssnano`,如果文件很短,就很好了,但是我的scss / css文件获取长的CSS文件,但未解析该文件。有谁知道这是为什么以及如何解决

在这里,package.json,Gruntfile.js以及可以工作的short-css-file.css和cssnano不会对其进行解析的long-css-file.css都可以。

package.json

{
  "name": "testpage","version": "1.0.0","description": "testpage grunt","main": "Gruntfile.js","dependencies": {},"devDependencies": {
    "cssnano": "^3.10.0","grunt": "^1.0.3","grunt-contrib-watch": "^1.0.0","grunt-postcss": "^0.8.0","load-grunt-tasks": "^3.5.2"
  },"scripts": {
    "test": "echo \"Error: no test specified\" && exit 1"
  },"author": "","license": "ISC"
}

Gruntfile.js

module.exports = function(grunt) {
    
    grunt.initConfig({
        watch: {
            css: {
                files:  'wp-content/themes/mytheme/assets/css/*.scss',tasks: ['sass','postcss']
            },},sass: {
            options: {
                sourceMap: true
            },dist: {
                files: {
                    'wp-content/themes/mytheme/assets/css/default.css': 'wp-content/themes/mytheme/assets/css/default.scss'
                }
            }
        },postcss: {
            options: {
                map: {
                    inline: false,// save all sourcemaps as separate files... 
                    sourcesContent: true,processors: [
                    require('autoprefixer')({browsers: ['last 2 versions','ie 8','ie 9']}),// add vendor prefixes
                    require('cssnano')({zindex: false}) // minify the result
                ]
            },dist: {
                files: {
                    'wp-content/themes/mytheme/assets/css/default.css': 'wp-content/themes/mytheme/assets/css/default.css'
                }
            }
        },});

    require('load-grunt-tasks')(grunt);

    grunt.registerTask('default',['watch','sass','postcss']);

};

short-css-file.css

// Test 
    .css_nano,.css_nano + p,[class*="css_nano"],.css_nano {
        /* cssnano will remove this comment */
        display: flex;
        font-weight: normal;
        margin-top: 1rem;
        margin-bottom: 2rem;
        margin-left: 1.5rem;
        margin-right: 2.5rem;
        font-weight: normal;
        padding: 1.75rem;
        width: calc(50rem - (2 * 1.75rem));
    }

long-css-file.css 参见jsfiddle

https://jsfiddle.net/12p3Lxcn/

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。

相关推荐


Selenium Web驱动程序和Java。元素在(x,y)点处不可单击。其他元素将获得点击?
Python-如何使用点“。” 访问字典成员?
Java 字符串是不可变的。到底是什么意思?
Java中的“ final”关键字如何工作?(我仍然可以修改对象。)
“loop:”在Java代码中。这是什么,为什么要编译?
java.lang.ClassNotFoundException:sun.jdbc.odbc.JdbcOdbcDriver发生异常。为什么?
这是用Java进行XML解析的最佳库。
Java的PriorityQueue的内置迭代器不会以任何特定顺序遍历数据结构。为什么?
如何在Java中聆听按键时移动图像。
Java“Program to an interface”。这是什么意思?
Java在半透明框架/面板/组件上重新绘画。
Java“ Class.forName()”和“ Class.forName()。newInstance()”之间有什么区别?
在此环境中不提供编译器。也许是在JRE而不是JDK上运行?
Java用相同的方法在一个类中实现两个接口。哪种接口方法被覆盖?
Java 什么是Runtime.getRuntime()。totalMemory()和freeMemory()?
java.library.path中的java.lang.UnsatisfiedLinkError否*****。dll
JavaFX“位置是必需的。” 即使在同一包装中
Java 导入两个具有相同名称的类。怎么处理?
Java 是否应该在HttpServletResponse.getOutputStream()/。getWriter()上调用.close()?
Java RegEx元字符(。)和普通点?