無法在我的項目中使用 Susy mixins

Question

我正在將現有代碼移動到基於 webpack+postCSS 的新配置。

我使用指南針和susy。

指南針混合沒問題。 但是使用 susy 我不能使用任何 mixin。 例如，如果我嘗試使用容器 mixin，則會出現以下錯誤：

No mixin named container

我不知道是什么導致了這個問題。 我沒有指南針。

這是我目前的情況：

 /* style.scss */ @import "compass"; @import "~susy/sass/susy"; .nav{ @include container(300px); border: 1px solid; }

 /* webpack.config.js */ { test: /\\.s(a|c)ss$/, use: [ 'babel-loader', 'raw-loader', 'postcss-loader', { loader: 'sass-loader', options: { includePaths: ['node_modules', 'node_modules/compass-mixins/*'] .map((d) => path.join(__dirname, d)) .map((g) => glob.sync(g)) .reduce((a, c) => a.concat(c), []) } } ] }

 /* postcss.config.js */ module.exports = { plugins: [ require('postcss-easy-import')({prefix: '_',extensions:['.css','.scss']}), require('autoprefixer')(), ] }

感謝幫助

Answer 1

你用的是什么版本的Susy？

Susy 3.0 刪除了所有的 mixin，並有其他重大的突破性變化。 您可以在更新的參考文檔或介紹性文章中閱讀更多內容。

Answer 2

此問題基於您使用的 susy 版本。 mixin 來自 susy 2，在 susy 3 中被移除。

如果您通過 npm 安裝了 susy。 您必須將 package.json 文件中的 susy 版本更改為 "susy": "<3.0.0" 然后運行此命令：npm install susy。