{"versions":{"0.0.1":{"name":"cnjm-postcss-px-to-viewport","description":"A CSS post-processor that converts px to viewport units (vw, vh, vmin, vmax).","version":"0.0.1","author":{"name":"cnjm"},"license":"MIT","scripts":{"test":"jasmine-node spec"},"repository":{"type":"git","url":"git+https://github.com/cnjm/postcss-px-to-viewport.git"},"bugs":{"url":"https://github.com/cnjm/postcss-px-to-viewport/issues"},"homepage":"https://github.com/cnjm/postcss-px-to-viewport","devDependencies":{"jasmine-node":"~1.11.0"},"keywords":["css","units","pixel","px","viewport","vw","vh","vmin","vmax","postcss","postcss-plugin"],"dependencies":{"object-assign":">=4.0.1","postcss":">=5.0.2"},"directories":{"example":"example"},"gitHead":"e35bd21b403e77eb78b49a0b42c66b448d0b5718","_id":"cnjm-postcss-px-to-viewport@0.0.1","_nodeVersion":"16.13.0","_npmVersion":"8.1.0","dist":{"integrity":"sha512-BN+hqXnfQo049UZ0zr7iEOjSgyPid754mLzEDQz7vOa3BiEw+cGs0qgkr3n8VMg0EaPQY9QlaA8b6oQdrXJDUw==","shasum":"f9e7e0a2ac93c6d8d358dee5df562f1ff277db0a","tarball":"http://123.232.10.234:8212/nexus/content/groups/npm-public/cnjm-postcss-px-to-viewport/-/cnjm-postcss-px-to-viewport-0.0.1.tgz","fileCount":9,"unpackedSize":16547,"signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIGsh1Spzb6EH/nLOgaGuwQ7YubaOn5a5pET/qN6q+99tAiEA7LO5wfocBokSaVmkuo1fE3XxA1ZFxDu/Uh01goe+Qgw="}],"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiVoB6ACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2Vmo3WhAAkd2ao19WGMJ9MF3u5df+nzuy0iPh3mgT12HU0Oq1WebU2I/s\r\nFCCmJ7vEsYmEByQr91yE2mtaAcyNgxLidbn/ik33TQHiRcNEic8sRKqoygzs\r\nNJaFSD2tHqHAHRaqv2iVPvH8i0HMmxfbXV0srYbdIgRgZczPk76XZU1H6KxQ\r\nnJdaljjS/iPvyUd7KKTRMGPQ0Zj8ITFtIE9AF77bgO0+3p0TqMpRfcAR7x69\r\nCE3V26mf7pLWNgzBfbTF9a3x8jV/h/sPPXh/Ijg5/WWBzQjnZav9cBQBCtGw\r\n8+Lz6pnxAb3HEpmu0OjhQfAevsBvbUUv8au2f2ptrgo0cNshhydSQSnG5Kxf\r\nXhPckflD0nlcYr6bHQOUqP2rrRQoxnd2l7uSAAykDgP1DDQSWtoipkd11rCJ\r\noHTbN3jtuKU5S3QzB/idr0aECoF0ZFawpqikq8kxCOwxsaDiVXTA4vwiEpfx\r\ntMJA2GQHa8tYrnWmeujg4b2yVaJHuQlUGRRfMaRe0gHSEoElTfQ3VnwCHs7x\r\nsAqAJVmEnCu62jUf/wDQ7NAk+0esl5tROCZUgptO1K9DiOR8GBFslvFrAT7q\r\naSiKqn3GDLbSos3IIIez0TA0t2B8K1uoaPWtKnO4mKvtfpafJU0nYJkS11Vo\r\nYN0NkMcGAwAQd5nnhr1LNMwBVIRYPfnb80w=\r\n=oFXD\r\n-----END PGP SIGNATURE-----\r\n","size":6690},"_npmUser":{"name":"anonymous","email":"1837847333@qq.com"},"maintainers":[{"name":"anonymous","email":"1837847333@qq.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/cnjm-postcss-px-to-viewport_0.0.1_1649836153902_0.662198213755252"},"_hasShrinkwrap":false,"_cnpmcore_publish_time":"2022-04-13T07:49:22.680Z","contributors":[]},"0.0.2":{"name":"cnjm-postcss-px-to-viewport","description":"A CSS post-processor that converts px to viewport units (vw, vh, vmin, vmax).","version":"0.0.2","author":{"name":"cnjm"},"license":"MIT","scripts":{"test":"jasmine-node spec"},"repository":{"type":"git","url":"git+https://github.com/cnjm/postcss-px-to-viewport.git"},"bugs":{"url":"https://github.com/cnjm/postcss-px-to-viewport/issues"},"homepage":"https://github.com/cnjm/postcss-px-to-viewport","devDependencies":{"jasmine-node":"~1.11.0"},"keywords":["css","units","pixel","px","viewport","vw","vh","vmin","vmax","postcss","postcss-plugin"],"dependencies":{"object-assign":">=4.0.1","postcss":">=5.0.2"},"directories":{"example":"example"},"gitHead":"55f3434f39e1b832481b906e9d638710fa01926a","_id":"cnjm-postcss-px-to-viewport@0.0.2","_nodeVersion":"16.13.0","_npmVersion":"8.1.0","dist":{"integrity":"sha512-q5rBdI9Vg4sgP+zEws338oONtAJKySju6kOKaV/6eqjP7Ec7p6HGAo9NFbhUDtHHHrrbczDyjxhS7NpdicsOEQ==","shasum":"739f50bc08aedf8e360f93ededc79e4dec077f0f","tarball":"http://123.232.10.234:8212/nexus/content/groups/npm-public/cnjm-postcss-px-to-viewport/-/cnjm-postcss-px-to-viewport-0.0.2.tgz","fileCount":9,"unpackedSize":18473,"signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQDYqUsn/qIpsFKjYjF5oeK8FIcP0dA2EagnTFDxuJIcgAIgS2FKd3x9bcF9MPNqfn7ji0Yes0RZeKfeE5s28Sq7bbc="}],"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiVoH0ACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmopIg/+PKzzh2e5m64BEGHsjlnKIiUDvPLPMp0rS1Xa3xX51SuGn/R5\r\n2520CFD+Cuc1UKwV7O6xpqJ0qHkRgNpkJnhek3owVwsBAvdoHjtg2GE1jbtG\r\nUohtCPADwbXQpg74rUNu3vkzvzqXRVgFNw8PpXkX6j2mRWOssFFjw9Cb68A5\r\nSLGgDz7bP1wI2ZhAwyEa2yFD8Vyaf4iU0S2KEa1Ik6uFCX8p835TpF7+4gUR\r\ng0UMK/aXLSKP6G3LZQ359tH7WPy56qIaEhpFL181n15RLm2mf5z3sH06MM8R\r\nLAVGFj/RNJp4gkcCH/ysuf2rY2NAo5E4XQI7msLyGqiMUZV7T5FMaDLMBQfo\r\nTRDoPOf9grN0tbza+K2rVpdY3WrwlVIPBCvCiEzEqe0WUc+vBJlmn+s/DUmq\r\nEuhQjKGUrYTUXy9s2NDFEmhE43VIKW4CxlPrbVntP47jkOv/L3DoTlM632yo\r\nDTgrR5c3RuOrSbv4Dh8ysGInTay5F/38BctUhb/ScPSDZmU4HBTJw0K3Ofek\r\ny3vx/+Q+wOXrcErY+m8x2wPifbYO5epJV/LxIPSxh6QlejwE2rs6pGcDufE3\r\n0Dqz1CM8hqrhVe6gnoGZc0ISqQOR3T2fU0gd+kIDM65n/osQIU8GNIUCzGfD\r\nMg6ZRiBtsC6eRkNisv8eFPezmPxMksHOB9o=\r\n=/+w8\r\n-----END PGP SIGNATURE-----\r\n","size":7466},"_npmUser":{"name":"anonymous","email":"1837847333@qq.com"},"maintainers":[{"name":"anonymous","email":"1837847333@qq.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/cnjm-postcss-px-to-viewport_0.0.2_1649836532687_0.777937762905325"},"_hasShrinkwrap":false,"_cnpmcore_publish_time":"2022-04-13T07:58:38.841Z","contributors":[]},"1.0.0":{"name":"cnjm-postcss-px-to-viewport","description":"A CSS post-processor that converts px to viewport units (vw, vh, vmin, vmax).","version":"1.0.0","author":{"name":"cnjm"},"license":"MIT","scripts":{"test":"jasmine-node spec"},"repository":{"type":"git","url":"git+https://github.com/cnjm/postcss-px-to-viewport.git"},"bugs":{"url":"https://github.com/cnjm/postcss-px-to-viewport/issues"},"homepage":"https://github.com/cnjm/postcss-px-to-viewport","devDependencies":{"jasmine-node":"~1.11.0","postcss":"^8.4.14"},"peerDependencies":{"postcss":"^8.4.14"},"keywords":["css","units","pixel","px","viewport","vw","vh","vmin","vmax","postcss","postcss-plugin"],"dependencies":{"object-assign":">=4.0.1"},"directories":{"example":"example"},"gitHead":"8dff2604b28948027422d9edec48ec649a947deb","_id":"cnjm-postcss-px-to-viewport@1.0.0","_nodeVersion":"16.13.0","_npmVersion":"8.1.0","dist":{"integrity":"sha512-vokFS5qvl7JG/W79JYGZgA19LiVvDzQ5aSIQvnZiZAK2lumP+MP8WCs2AU/fK1aSIBpVmqgRpU4m27RBJ2F7rw==","shasum":"db379693b4594af54d783d3fba0bc78b94644fcd","tarball":"http://123.232.10.234:8212/nexus/content/groups/npm-public/cnjm-postcss-px-to-viewport/-/cnjm-postcss-px-to-viewport-1.0.0.tgz","fileCount":9,"unpackedSize":21794,"signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIH0Y7lY2jDHc1bfibZ9bzFIADsb3OksqmG05J65KZDOUAiEApI+nRJVEh7tIrVaqyxI8GQDhpeiURK5OMtps9dgoIoQ="}],"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJinuvAACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2Vmpnzw//WvaP1b8X2YwwR4zinmB5UraF+XSD9oEczfIxp7LWESNmwFZn\r\nnI5iWRcMtJ+GdYoiMRrZgUEGUVas7LQcGEq3V94Iw4o75qzDiX7ph6JTFZzw\r\nfGv76nH7icSFuaiPAv5hFttrMyfQ7oTjnoGeq9CtIdGo1/n8SToS9ZzgCOef\r\n0b+hpjh1daEknc0xfEMe65ii9vPYHe3uiJgzrbP3IMmjGFXiuvtP8qYlJ0mO\r\n/0gXknLlpqXvA2F6xSMC7TydS0O8JRTEaRrmh7zN/kku8frBIwYF8CEd8+jD\r\n5iomnPLilrO/AvS2ptv2D55PY36tggXofv8xDYLygF1Tr1/OK9/ydzwKXfZV\r\nTajMMKo39NKn2IT42Kr91P9NV6ifuAM7i68D5aNByzi3xugy1lk0K4Bhg/XT\r\ntrEeBVrtCiguiscoAu5th4qXZFAt/Jtt79IHWJqHEhiBh0/07YLp6KN6SB2C\r\nFOgHqn49aA2E2uy+HNQ8YYEtoJXt+14cQrn/VA4q2NGb4T0cLo1TTi0uITMJ\r\nhBDky/VNtHAoC+6+a29H/UC4u4JbXptTc1DTx9uBLNmKKKlFDFtqfUDotH08\r\ndhH9fDVXJLj5b8vUu23TF9TJcQ/4vgsRxYxXmV5oOTjzNMFfF6TQ5SkFBelU\r\nB2pqoLITfABC2zB9BRVLNrSzU/WlVoq9wwM=\r\n=heJr\r\n-----END PGP SIGNATURE-----\r\n","size":7908},"_npmUser":{"name":"anonymous","email":"1837847333@qq.com"},"maintainers":[{"name":"anonymous","email":"1837847333@qq.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/cnjm-postcss-px-to-viewport_1.0.0_1654582207977_0.2117688810816507"},"_hasShrinkwrap":false,"_cnpmcore_publish_time":"2022-06-07T06:11:53.310Z","contributors":[]},"1.0.1":{"name":"cnjm-postcss-px-to-viewport","description":"A CSS post-processor that converts px to viewport units (vw, vh, vmin, vmax).","version":"1.0.1","author":{"name":"cnjm"},"license":"MIT","scripts":{"test":"jasmine-node spec"},"repository":{"type":"git","url":"git+https://github.com/cnjm/postcss-px-to-viewport.git"},"bugs":{"url":"https://github.com/cnjm/postcss-px-to-viewport/issues"},"homepage":"https://github.com/cnjm/postcss-px-to-viewport","devDependencies":{"jasmine-node":"~1.11.0","postcss":"^8.4.14"},"peerDependencies":{"postcss":"^8.4.14"},"keywords":["css","units","pixel","px","viewport","vw","vh","vmin","vmax","postcss","postcss-plugin"],"dependencies":{"object-assign":">=4.0.1"},"directories":{"example":"example"},"gitHead":"9c9f4b487218fec2cd32d594615076f80e66bd52","_id":"cnjm-postcss-px-to-viewport@1.0.1","_nodeVersion":"16.20.1","_npmVersion":"8.19.4","dist":{"integrity":"sha512-0Gi8ECxoHZygnC9IS3J3IbNwP16CdZiS1Sj6JT6Di2qnduz3eNIfZ/zXVSqia5Kw85a4PAUXmOqTQmQY0UYYMQ==","shasum":"a67741100bf6be40912b21255799be49de75dc54","tarball":"http://123.232.10.234:8212/nexus/content/groups/npm-public/cnjm-postcss-px-to-viewport/-/cnjm-postcss-px-to-viewport-1.0.1.tgz","fileCount":6,"unpackedSize":16251,"signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIA5lpd2GFJMgzn7Z5liTrZswMZ90Emc29bsOHfG1/iCJAiEAobOIdCpnviJmHMty9/Yr+e/lZRo9GkgMq3P3wIrpQxo="}]},"_npmUser":{"name":"anonymous","email":"1837847333@qq.com"},"maintainers":[{"name":"anonymous","email":"1837847333@qq.com"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/cnjm-postcss-px-to-viewport_1.0.1_1702542559352_0.846762710967496"},"_hasShrinkwrap":false,"contributors":[]}},"dist-tags":{"latest":"1.0.1"},"name":"cnjm-postcss-px-to-viewport","time":{"created":"2022-04-13T07:49:28.756Z","modified":"2023-12-14T08:32:32.965Z","0.0.1":"2022-04-13T07:49:14.047Z","0.0.2":"2022-04-13T07:55:32.837Z","1.0.0":"2022-06-07T06:10:08.099Z","1.0.1":"2023-12-14T08:29:19.631Z"},"readme":"# cnjm-postcss-px-to-viewport\r\n[基于postcss-px-to-viewport插件稍加改造的](https://github.com/evrone/postcss-px-to-viewport)\r\n和使用postcss-px-to-viewport 是基本一样的，只是多处理了vant等375尺寸问题，你也可以选择克隆到自己仓库中使用，也可以直接使用笔者改的\r\n\r\n顺便把插件升级了postcss到v8+,规避了postcss.plugin was deprecated. Migration guide:  的警告，\r\n\r\n```bash\r\nnpm i cnjm-postcss-px-to-viewport\r\n锁死v0.0.2,则为不更新postcss版本\r\n```\r\n\r\n## 简介（为什么有）\r\n\r\n一直希望在**vite** 中 使用 postcss-px-to-viewport 时可以设置不同的设计尺寸，比如**vant**是375设计的\r\n\r\n而我们可能是750或其他尺寸，一直找了好久都没有合适的解决方案（有个webpack的，不过vite的貌似不行），如果有知道其他好的解决方法的，麻烦告知一下，感激不尽！\r\n\r\n干脆就稍加改了一下postcss-px-to-viewport的代码\r\n\r\n其实就是在src/index.js中加入了以下代码，把当前文件路径暴露出去，接收一个新的viewportWidth并赋值给opts\r\n\r\n具体可以看下源代码\r\n```js\r\nif(opts.customFun){\r\n  opts.viewportWidth = opts.customFun({file:rule.source.input.file});\r\n}\r\n```\r\n\r\n配置时使用cnjm-postcss-px-to-viewport\r\n\r\n```js\r\nconst path = require(\"path\");\r\nmodule.exports = () => {\r\n  return {\r\n    plugins: {\r\n      autoprefixer: {\r\n        overrideBrowserslist: [\"Android 4.1\", \"iOS 7.1\", \"Chrome > 31\", \"ff > 31\", \"ie >= 8\"],\r\n      },\r\n      // 修改插件名称\r\n      \"cnjm-postcss-px-to-viewport\": {\r\n        unitToConvert: \"px\", // 要转化的单位\r\n        viewportWidth: 750, // UI设计稿的宽度\r\n        unitPrecision: 6, // 转换后的精度，即小数点位数\r\n        propList: [\"*\"], // 指定转换的css属性的单位，*代表全部css属性的单位都进行转换\r\n        viewportUnit: \"vw\", // 指定需要转换成的视窗单位，默认vw\r\n        fontViewportUnit: \"vw\", // 指定字体需要转换成的视窗单位，默认vw\r\n        selectorBlackList: [\"ignore\"], // 指定不转换为视窗单位的类名，\r\n        minPixelValue: 1, // 默认值1，小于或等于1px则不进行转换\r\n        mediaQuery: true, // 是否在媒体查询的css代码中也进行转换，默认false\r\n        replace: true, // 是否转换后直接更换属性值\r\n        exclude: [], // 设置忽略文件，用正则做目录名匹配\r\n        landscape: false, // 是否处理横屏情况\r\n        // 如果没有使用其他的尺寸来设计，下面这个方法可以不需要，比如vant是375的\r\n        customFun: ({ file }) => {\r\n          // 这个自定义的方法是针对处理vant组件下的设计稿为375问题\r\n          const designWidth = path.join(file).includes(path.join(\"node_modules\", \"vant\")) ? 375 : 750;\r\n          return designWidth;\r\n        },\r\n      },\r\n    },\r\n  };\r\n};\r\n\r\n```\r\n\r\n\r\nhttps://github.com/vitejs/vite/issues/4653  多个配置,这将导致插件处理两次，**优点缺点都很明显，具体怎么用，见人见智了**\r\n\r\n```typescript\r\nconst px2viewport = require(\"postcss-px-to-viewport\");\r\nconst autoprefixer = require(\"autoprefixer\");\r\nmodule.exports = () => {\r\n  return {\r\n    plugins: [\r\n      autoprefixer({\r\n        overrideBrowserslist: [\"Android 4.1\", \"iOS 7.1\", \"Chrome > 31\", \"ff > 31\", \"ie >= 8\"],\r\n      }),\r\n      px2viewport({\r\n        unitToConvert: \"px\", // 要转化的单位\r\n        viewportWidth: 375, // UI设计稿的宽度\r\n        unitPrecision: 6, // 转换后的精度，即小数点位数\r\n        propList: [\"*\"], // 指定转换的css属性的单位，*代表全部css属性的单位都进行转换\r\n        viewportUnit: \"vw\", // 指定需要转换成的视窗单位，默认vw\r\n        fontViewportUnit: \"vw\", // 指定字体需要转换成的视窗单位，默认vw\r\n        selectorBlackList: [\"ignore\"], // 指定不转换为视窗单位的类名，\r\n        minPixelValue: 1, // 默认值1，小于或等于1px则不进行转换\r\n        mediaQuery: true, // 是否在媒体查询的css代码中也进行转换，默认false\r\n        replace: true, // 是否转换后直接更换属性值\r\n        exclude: [/^(?!.*node_modules\\/vant)/], // 设置忽略文件，用正则做目录名匹配\r\n        landscape: false, // 是否处理横屏情况\r\n      }),\r\n      px2viewport({\r\n        unitToConvert: \"px\", // 要转化的单位\r\n        viewportWidth: 750, // UI设计稿的宽度\r\n        unitPrecision: 6, // 转换后的精度，即小数点位数\r\n        propList: [\"*\"], // 指定转换的css属性的单位，*代表全部css属性的单位都进行转换\r\n        viewportUnit: \"vw\", // 指定需要转换成的视窗单位，默认vw\r\n        fontViewportUnit: \"vw\", // 指定字体需要转换成的视窗单位，默认vw\r\n        selectorBlackList: [\"ignore\"], // 指定不转换为视窗单位的类名，\r\n        minPixelValue: 1, // 默认值1，小于或等于1px则不进行转换\r\n        mediaQuery: true, // 是否在媒体查询的css代码中也进行转换，默认false\r\n        replace: true, // 是否转换后直接更换属性值\r\n        exclude: [/node_modules\\/vant/i], // 设置忽略文件，用正则做目录名匹配\r\n        landscape: false, // 是否处理横屏情况\r\n      }),\r\n    ],\r\n  };\r\n};\r\n```","users":{}}