javascript - 如何将 postcss.plugin 迁移到 postCSS 8 格式
问题描述
我正在尝试将旧的 postCSS 插件迁移到新版本以使单元测试成功。我的 index.js 看起来像这样:
const postcss = require('postcss')
const params = require('./lib/params')
const formatAtRules = require('./lib/formatAtRules')
const formatOrder = require('./lib/formatOrder')
const formatRules = require('./lib/formatRules')
const formatComments = require('./lib/formatComments')
const formatSassVariables = require('./lib/formatSassVariables')
const stylefmt = postcss.plugin('stylefmt', function (options) {
var paramer = params(options)
return function (root, result) {
return paramer(root, result).then(function (params) {
if(params) {
formatComments(root, params)
formatAtRules(root, params)
formatRules(root, params)
formatSassVariables(root, params)
// order should be the last to prevent empty line collapse in order rules
formatOrder(root, params)
}
}).catch(function (err) {
console.error(err.stack)
})
}
})
module.exports = stylefmt
这会在运行时在控制台中引发如下错误tape test/*.js |faucet
:
Error: postcss.plugin was deprecated. Migration guide: https://evilmartians.com/chronicles/postcss-8-plugin-migration
---
operator: error
at: <anonymous> (/Users/rolle/Projects/stylefmt/test/cli.js:11:9)
stack: |-
Error: postcss.plugin was deprecated. Migration guide:
https://evilmartians.com/chronicles/postcss-8-plugin-migration
at ChildProcess.<anonymous> (/Users/rolle/Projects/stylefmt/test/cli.js:151:16)
at ChildProcess.emit (events.js:198:13)
at Process.ChildProcess._handle.onexit (internal/child_process.js:248:12)
...
我对 JavaScript 方面的 postCSS 插件和单元测试有点陌生。我曾尝试使用迁移指南但无济于事。那么,如何将这部分转换为 postCSS 8 格式以便测试通过呢?这是我的仓库:https ://github.com/ronilaukkarinen/stylefmt
解决方案
回答我自己的问题。终于找到有人用不同的插件做了同样的事情,在这里提示一下。
最终代码:
const postcss = require('postcss')
const params = require('./lib/params')
const formatAtRules = require('./lib/formatAtRules')
const formatOrder = require('./lib/formatOrder')
const formatRules = require('./lib/formatRules')
const formatComments = require('./lib/formatComments')
const formatSassVariables = require('./lib/formatSassVariables')
module.exports = function (options) {
var paramer = params(options)
return {
postcssPlugin: 'stylefmt',
Once: function Once (root, _ref) {
var result = _ref.result
return paramer(root, result).then(function (params) {
if(params) {
formatComments(root, params)
formatAtRules(root, params)
formatRules(root, params)
formatSassVariables(root, params)
// order should be the last to prevent empty line collapse in order rules
formatOrder(root, params)
}
}).catch(function (err) {
console.error(err.stack)
})
}
}
}
module.exports.postcss = true
这使得测试通过。
推荐阅读
- javascript - 是否可以在加载完成之前捕获 iframe 窗口?
- flutter - 如何将 ReorderableListView 放入 Sliver 中?
- javascript - 如何按顺序运行这些承诺
- android - Google Vision API 中的 Barcode API 概述是免费的吗?
- python - 在 Python 中翻转压缩列表中的对
- apache-spark-sql - 仅使用 SQL 语句计算转推
- javascript - 在 JavaScript 中生成长字符串的最快方法(性能)
- c++ - C ++:包含彼此的标题会导致错误“尚未声明类”
- javascript - 部署在 GitHub 页面上的 ReactJS 应用程序不适用于自定义域集
- c++ - 从邻接表 C++ 中删除元素