无法在我的项目中使用 Susy mixins
Impossible to use Susy mixins on my project
我正在将现有代码移动到基于 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')(),
]
}
感谢帮助
您使用的是哪个版本的 Susy?
Susy 3.0 删除了所有混合宏,并进行了其他重大的重大更改。您可以在 updated reference docs or the introductory article.
中阅读更多内容
此问题与您使用的 susy 版本有关。 mixin 来自 susy 2,并已在 susy 3 中删除。
如果你通过 npm 安装了 susy。您必须将 package.json 文件中的 susy 版本更改为 "susy": "<3.0.0" 然后 运行 此命令:npm install susy.
我正在将现有代码移动到基于 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')(),
]
}
感谢帮助
您使用的是哪个版本的 Susy?
Susy 3.0 删除了所有混合宏,并进行了其他重大的重大更改。您可以在 updated reference docs or the introductory article.
中阅读更多内容此问题与您使用的 susy 版本有关。 mixin 来自 susy 2,并已在 susy 3 中删除。
如果你通过 npm 安装了 susy。您必须将 package.json 文件中的 susy 版本更改为 "susy": "<3.0.0" 然后 运行 此命令:npm install susy.