2017-10-23 11 views
0

私はgulpとpostCSSに関するUdemyビデオコースを聞いていて、チューターと同じことをしていますが、何も動作しません。Gulp post media-queriesでCSS-mixinsの問題

マイメディアクエリのミックスイン:

@define-mixin atSmall { 
    @media (min-width: 530px) { 
     @mixin-content; 
    } 
} 

マイpostCSSコード:

.large-hero__title { 
    font-size: 1.1rem; 

    @mixin atSmall { 
     font-size: 2rem; 
    } 
} 

とメディアクエリが正常に動作しないことができるようにそれは、このコードにコンパイルされます。

.large-hero__title { 

    font-size: 1.1rem; 

    @media (min-width: 530px) { 
     font-size: 2rem; 
    } 
} 

My Gulp依存関係リスト:

"dependencies": { 
    "jquery": "^3.2.1", 
    "normalize.css": "^7.0.0" 
    }, 
    "devDependencies": { 
    "autoprefixer": "^7.1.5", 
    "browser-sync": "^2.18.13", 
    "gulp": "^3.9.1", 
    "gulp-postcss": "^7.0.0", 
    "gulp-watch": "^4.3.11", 
    "postcss-import": "^11.0.0", 
    "postcss-mixins": "^6.2.0", 
    "postcss-nested": "^2.1.2", 
    "postcss-simple-vars": "^4.1.0" 
    } 

Gulp Watchに問題はありません.Gulp Watchは正常に動作しています。講師のコースでは、すべてこの構文とコードで動作しますが、そうではありません。私は間違って何をしていますか?

答えて

0

問題を解決するために、私はgulpタスクファイルに 'postcss-mixin'の後に 'postcss-nested'を入れました。