在 Angular 中使用 PostCSS 需要安装并配置一些插件。
- 安装 PostCSS 以及必要的插件:
npm install --save-dev postcss postcss-import postcss-preset-env
- 在项目的根目录中创建一个
postcss.config.js
文件,并添加以下内容:
module.exports = {
plugins: [
require('postcss-import'),
require('postcss-preset-env'),
]
};
- 在
angular.json
文件中的projects.projectName.architect.build.options.styles
字段下添加以下内容:
"styles": [
"src/styles.css",
{
"input": "src/styles.css",
"output": "dist/styles.css",
"postcss": true
}
],
这样,在你的项目中就可以使用 PostCSS 了。你可以在你的样式文件中使用 PostCSS 的语法,比如 @import
和 @apply
等。
如果你想使用更多的 PostCSS 插件,可以在 postcss.config.js
中添加配置。比如,如果你想使用 Autoprefixer,可以在配置文件中添加以下内容:
module.exports = {
plugins: [
require('postcss-import'),
require('postcss-preset-env'),
require('autoprefixer'),
]
};
版权声明:本文为weixin_35753431原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接和本声明。