vite-plugin-style-to-vw - npm Package Compare versions

Comparing version 1.8.6 to 1.8.7

dist/index.d.ts

@@ -12,2 +12,4 @@ import { Plugin } from 'vite';
   attributeList?:string[],
+  include: string | RegExp | (string | RegExp)[],
+  exclude: string | RegExp | (string | RegExp)[]
 }
@@ -14,0 +16,0 @@

package.json

 {
   "name": "vite-plugin-style-to-vw",
-  "version": "1.8.6",
+  "version": "1.8.7",
   "description": "一个可以将签内样式px转换vw的plugin",
@@ -52,2 +52,3 @@ "exports": {
   "devDependencies": {
+    "@rollup/pluginutils": "^5.1.0",
     "@types/node": "^18.14.0",
@@ -66,3 +67,6 @@ "@typescript-eslint/eslint-plugin": "^5.53.0",
     "url": "https://github.com/cq112233/vite-plugin-style-to-vw/issues"
+  },
+  "dependencies": {
+    "pluginutils": "link:@types/@rollup/pluginutils"
   }
 }

README.md

 # vite-plugin-style-to-vw
 
-A plugin that can convert intra-tag style px to vw
+A plugin that can convert intra-tag style px to vw 
 
-> A plugin that can convert intra-tag style px to vw
+> A plugin that can convert intra-tag style px to vw / rem 
 
+## Give me a star if it is easy to use
+
 [![NPM version](https://img.shields.io/npm/v/vite-plugin-style-to-vw.svg)](https://www.npmjs.com/package/vite-plugin-style-to-vw)
@@ -8,0 +10,0 @@

README.zh-CN.md

@@ -8,2 +8,4 @@
 
+## 好用的话给个star哦🙏
+
 [![NPM version](https://img.shields.io/npm/v/vite-plugin-style-to-vw.svg)](https://www.npmjs.com/package/vite-plugin-style-to-vw)
@@ -10,0 +12,0 @@

src/index.d.ts

@@ -11,2 +11,4 @@ import { Plugin } from "vite";
   attributeList?:string[],
+  include: string | RegExp | (string | RegExp)[],
+  exclude: string | RegExp | (string | RegExp)[]
 }
@@ -13,0 +15,0 @@

src/index.ts

 import type { IdefaultsProp } from './index.d'
 import fs from 'fs'
+// import util  from '@rollup/pluginutils'
+let utils
+// @ts-ignore
+if (typeof window === "undefined") {
+  utils = await import('@rollup/pluginutils')
+}
 
@@ -13,6 +19,9 @@ // 默认参数
   minPixelValue: 1, // 设置最小的转换数值，如果为 1 的话，只有大于 1 的值会被转换
-  attributeList: []
+  attributeList: [], // 添加额外转换属性
+  include: [], // 包含哪些文件
+  exclude: []  // 排除哪些文件
 };
 
 
+// console.log('utils',utils.createFilter(['**/*.vue'],['node_modules/**/*']))
 
@@ -92,2 +101,4 @@
 function vitePluginStyleToVw(customOptions: IdefaultsProp = defaultsProp) {
+  // @ts-ignore
+  if (typeof window !== "undefined") return console.warn('Please use it in node environment !!!')
   // 合并
@@ -97,2 +108,6 @@ const copyDefaultsProp = Object.assign({}, defaultsProp)
   customOptions = Object.assign(copyDefaultsProp, customOptions)
+
+  // 包含排除
+  const filter = utils.createFilter(customOptions.include,customOptions.exclude)
+
   try {
@@ -113,115 +128,117 @@ // 异步写入文件
     transform(code: any, id: any) {
-      if (/.vue$/.test(id)) {
-        let _source = ''
-        let _sourceCopy = ''
-        // template 模式
-        if (templateReg.test(code)) {
-          _source = code.match(templateReg)[0]
-          _sourceCopy = code.match(templateReg)[0]
-        } else if (code.includes('setup')) {
-          _source = code
-          _sourceCopy = code
-        }
-        if (replaceReg.test(_source)) {
+      if (filter(id)) {
+        if (/.vue$/.test(id)) {
+          let _source = ''
+          let _sourceCopy = ''
+          // template 模式
+          if (templateReg.test(code)) {
+            _source = code.match(templateReg)[0]
+            _sourceCopy = code.match(templateReg)[0]
+          } else if (code.includes('setup')) {
+            _source = code
+            _sourceCopy = code
+          }
+          if (replaceReg.test(_source)) {
 
-          const styleMatches = _source.match(replaceReg) as string[]
+            const styleMatches = _source.match(replaceReg) as string[]
 
-          if (styleMatches?.length) {
-            // 遍历每个 style 属性值,替换 px 为 vw
-            const newStyleValues: string[] = []
-            for (let i = 0; i < styleMatches.length; i++) {
-              const styleValue = styleMatches[i]
-              const newStyleValue = styleValue.replace(pxGlobalReg, (match) => {
-                return match.replace(
-                  pxGlobalReg,
-                  createPxReplace(
-                    customOptions.viewportWidth as number,
-                    customOptions.minPixelValue  as number,
-                    customOptions.unitPrecision  as number,
-                    customOptions.viewportUnit as string,
-                  ),
-                )
-              })
-              newStyleValues.push(newStyleValue)
+            if (styleMatches?.length) {
+              // 遍历每个 style 属性值,替换 px 为 vw
+              const newStyleValues: string[] = []
+              for (let i = 0; i < styleMatches.length; i++) {
+                const styleValue = styleMatches[i]
+                const newStyleValue = styleValue.replace(pxGlobalReg, (match) => {
+                  return match.replace(
+                    pxGlobalReg,
+                    createPxReplace(
+                      customOptions.viewportWidth as number,
+                      customOptions.minPixelValue as number,
+                      customOptions.unitPrecision as number,
+                      customOptions.viewportUnit as string,
+                    ),
+                  )
+                })
+                newStyleValues.push(newStyleValue)
+              }
+              // 将新的 style 属性值替换回原始字符串
+              let newStr = _source
+              for (let i = 0; i < styleMatches.length; i++) {
+                newStr = newStr.replace(styleMatches[i], `${newStyleValues[i]}`)
+              }
+              code = code.replace(_sourceCopy, newStr)
             }
-            // 将新的 style 属性值替换回原始字符串
-            let newStr = _source
-            for (let i = 0; i < styleMatches.length; i++) {
-              newStr = newStr.replace(styleMatches[i], `${newStyleValues[i]}`)
-            }
-            code = code.replace(_sourceCopy, newStr)
+
           }
+          if (!isAllReplace) {
+            // 处理属性列表
+            code = dealAttributeList(code, customOptions.attributeList, customOptions)
+          }
 
-        }
-        if (!isAllReplace) {
-          // 处理属性列表
-          code = dealAttributeList(code, customOptions.attributeList, customOptions)
-        }
-
-      } else if (/\.tsx|\.jsx$/.test(id)) {
-        let _source = code
-        let _sourceCopy = code
-        // 匹配style
-        if (replaceReg.test(_source)) {
-          const styleMatches = _source.match(replaceReg) as string[]
-          if (styleMatches?.length) {
-            // 遍历每个 style 属性值,替换 px 为 vw
-            const newStyleValues: string[] = []
-            for (let i = 0; i < styleMatches.length; i++) {
-              const styleValue = styleMatches[i]
-              const newStyleValue = styleValue.replace(pxGlobalReg, (match) => {
-                return match.replace(
-                  pxGlobalReg,
-                  createPxReplace(
-                    customOptions.viewportWidth as number,
-                    customOptions.minPixelValue  as number,
-                    customOptions.unitPrecision  as number,
-                    customOptions.viewportUnit as string,
-                  ),
-                )
-              })
-              newStyleValues.push(newStyleValue)
+        } else if (/\.tsx|\.jsx$/.test(id)) {
+          let _source = code
+          let _sourceCopy = code
+          // 匹配style
+          if (replaceReg.test(_source)) {
+            const styleMatches = _source.match(replaceReg) as string[]
+            if (styleMatches?.length) {
+              // 遍历每个 style 属性值,替换 px 为 vw
+              const newStyleValues: string[] = []
+              for (let i = 0; i < styleMatches.length; i++) {
+                const styleValue = styleMatches[i]
+                const newStyleValue = styleValue.replace(pxGlobalReg, (match) => {
+                  return match.replace(
+                    pxGlobalReg,
+                    createPxReplace(
+                      customOptions.viewportWidth as number,
+                      customOptions.minPixelValue as number,
+                      customOptions.unitPrecision as number,
+                      customOptions.viewportUnit as string,
+                    ),
+                  )
+                })
+                newStyleValues.push(newStyleValue)
+              }
+              // 将新的 style 属性值替换回原始字符串
+              let newStr = _source
+              for (let i = 0; i < styleMatches.length; i++) {
+                newStr = newStr.replace(styleMatches[i], `${newStyleValues[i]}`)
+              }
+              code = code.replace(_sourceCopy, newStr)
+              _sourceCopy = code
+              _source = code
             }
-            // 将新的 style 属性值替换回原始字符串
-            let newStr = _source
-            for (let i = 0; i < styleMatches.length; i++) {
-              newStr = newStr.replace(styleMatches[i], `${newStyleValues[i]}`)
-            }
-            code = code.replace(_sourceCopy, newStr)
-            _sourceCopy = code
-            _source = code
           }
-        }
-        // 处理属性列表
-        if (!isAllReplace) {
           // 处理属性列表
-          code = dealAttributeList(code, customOptions.attributeList, customOptions)
-        }
-        // react 设置important
-        if (styleSetPropertyReg.test(_source)) {
-          const styleMatches = _source.match(styleSetPropertyReg) as string[]
-          if (styleMatches?.length) {
-            // 遍历每个 style 属性值,替换 px 为 vw
-            const newStyleValues: string[] = []
-            for (let i = 0; i < styleMatches.length; i++) {
-              const styleValue = styleMatches[i]
-              const newStyleValue = styleValue.replace(pxGlobalReg, (match) => {
-                return match.replace(
-                  pxGlobalReg,
-                  createPxReplace(
-                    customOptions.viewportWidth as number,
-                    customOptions.minPixelValue  as number,
-                    customOptions.unitPrecision  as number,
-                    customOptions.viewportUnit as string,
-                  ),
-                )
-              })
-              newStyleValues.push(newStyleValue)
+          if (!isAllReplace) {
+            // 处理属性列表
+            code = dealAttributeList(code, customOptions.attributeList, customOptions)
+          }
+          // react 设置important
+          if (styleSetPropertyReg.test(_source)) {
+            const styleMatches = _source.match(styleSetPropertyReg) as string[]
+            if (styleMatches?.length) {
+              // 遍历每个 style 属性值,替换 px 为 vw
+              const newStyleValues: string[] = []
+              for (let i = 0; i < styleMatches.length; i++) {
+                const styleValue = styleMatches[i]
+                const newStyleValue = styleValue.replace(pxGlobalReg, (match) => {
+                  return match.replace(
+                    pxGlobalReg,
+                    createPxReplace(
+                      customOptions.viewportWidth as number,
+                      customOptions.minPixelValue as number,
+                      customOptions.unitPrecision as number,
+                      customOptions.viewportUnit as string,
+                    ),
+                  )
+                })
+                newStyleValues.push(newStyleValue)
+              }
+              // 将新的 style 属性值替换回原始字符串
+              let newStr = _source
+              for (let i = 0; i < styleMatches.length; i++) {
+                newStr = newStr.replace(styleMatches[i], `${newStyleValues[i]}`)
+              }
+              code = code.replace(code, newStr)
             }
-            // 将新的 style 属性值替换回原始字符串
-            let newStr = _source
-            for (let i = 0; i < styleMatches.length; i++) {
-              newStr = newStr.replace(styleMatches[i], `${newStyleValues[i]}`)
-            }
-            code = code.replace(code, newStr)
           }
@@ -267,4 +284,4 @@ }
           customOptions.viewportWidth as number,
-          customOptions.minPixelValue  as number,
-          customOptions.unitPrecision  as number,
+          customOptions.minPixelValue as number,
+          customOptions.unitPrecision as number,
           ''
@@ -286,4 +303,4 @@ ),
           customOptions.viewportWidth as number,
-          customOptions.minPixelValue  as number,
-          customOptions.unitPrecision  as number,
+          customOptions.minPixelValue as number,
+          customOptions.unitPrecision as number,
           customOptions.viewportUnit as string,
@@ -290,0 +307,0 @@ ),

New alerts

Dynamic require

Supply chain risk

Dynamic require can indicate the package is performing dangerous or unsafe dynamic code execution.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

61422

increased by98.66%

Number of package files

13

increased by18.18%

Lines of code

467

increased by40.66%

Number of lines in readme file

224

increased by0.9%

Worsened metrics

Dependency count

1

increased byInfinity%

Dev dependency count

8

increased by14.29%

Number of low supply chain risk alerts

5

increased by150%

Dependency changes

• + Addedpluginutils@link:@types/@rollup/pluginutils