feat: update vite (#3225)

* feat: bump vite and dependant packages * fix: create relative paths for generated chunks * feat: update vite versions across packages
epicmaxco · Mar 31, 2023 · efe39bc · efe39bc
1 parent 8d8051d
commit efe39bc
Show file tree

Hide file tree

Showing 6 changed files with 70 additions and 184 deletions.
diff --git a/packages/sandbox/package.json b/packages/sandbox/package.json
@@ -41,7 +41,7 @@
     "ts-loader": "^9.3.0",
     "ts-node": "^10.8.1",
     "typescript": "^4.3.2",
-    "vite": "^2.4.4",
+    "vite": "^4.2.1",
     "vitest": "*",
     "vue-bundle-renderer": "0.4.1",
     "vue-tsc": "^0.38.2",

diff --git a/packages/tailwind/package.json b/packages/tailwind/package.json
@@ -33,6 +33,6 @@
     "registry": "https://registry.npmjs.org"
   },
   "devDependencies": {
-    "vite": "^2.9.8"
+    "vite": "^4.2.1"
   }
 }
diff --git a/packages/ui/build/plugins/append-component-css.ts b/packages/ui/build/plugins/append-component-css.ts
@@ -1,5 +1,5 @@
 import { existsSync } from 'fs'
-import { extname, dirname, basename } from 'path'
+import { extname, dirname, basename, relative, resolve } from 'path'
 import { createDistTransformPlugin } from './fabrics/create-dist-transform-plugin'
 
 const parsePath = (path: string) => {
@@ -27,15 +27,18 @@ export const appendComponentCss = createDistTransformPlugin({
 
   dir: (outDir) => `${outDir}/src/components`,
 
-  transform: (componentContent, path) => {
+  transform (componentContent, path) {
     if (!isVuesticComponent(path)) { return }
 
     const { name, dir } = parsePath(path)
 
-    const cssFilePath = `${dir}/${name}.css`
+    const distPath = resolve(this.outDir, '..', '..')
+    const relativeDistPath = relative(dir, distPath)
+    const relativeFilePath = relativeDistPath + '/' + name.replace(/-.*$/, '') + '.css'
 
-    if (!existsSync(cssFilePath)) { return }
+    if (!existsSync(resolve(dir, relativeFilePath))) { return }
 
-    return appendBeforeSourceMapComment(componentContent, `\nimport './${name}.css';`)
+    return appendBeforeSourceMapComment(componentContent, `\nimport '${relativeFilePath}';`)
   },
+
 })
diff --git a/packages/ui/build/plugins/fabrics/create-dist-transform-plugin.ts b/packages/ui/build/plugins/fabrics/create-dist-transform-plugin.ts
@@ -3,7 +3,7 @@ import { readdir, readFile, writeFile, lstat } from 'fs/promises'
 
 type Nothing = null | undefined | void
 type TransformFnResult = string | Nothing
-type TransformFn = (content: string, path: string) => TransformFnResult | Promise<TransformFnResult>
+type TransformFn = (this: { outDir: string }, content: string, path: string) => TransformFnResult | Promise<TransformFnResult>
 
 export const createDistTransformPlugin = (options: {
   name: string,
@@ -23,7 +23,7 @@ export const createDistTransformPlugin = (options: {
 
         const content = await readFile(currentPath, 'utf8')
 
-        const result = await options.transform(content, currentPath)
+        const result = await options.transform.call({ outDir }, content, currentPath)
 
         if (!result) { return }
 

diff --git a/packages/ui/package.json b/packages/ui/package.json
@@ -64,7 +64,7 @@
     "@types/yargs": "^17.0.10",
     "@typescript-eslint/eslint-plugin": "^4.12.0",
     "@typescript-eslint/parser": "^4.12.0",
-    "@vitejs/plugin-vue": "^2.3.2",
+    "@vitejs/plugin-vue": "^4.1.0",
     "@vue/cli-plugin-babel": "^5.0.0-alpha.3",
     "@vue/cli-plugin-e2e-cypress": "^5.0.0-alpha.3",
     "@vue/cli-plugin-eslint": "^5.0.0-alpha.3",
@@ -110,8 +110,8 @@
     "stylelint-config-standard": "^22.0.0",
     "ts-loader": "^8.0.14",
     "typescript": "4.7.4",
-    "vite": "^2.9.8",
-    "vite-plugin-chunk-split": "^0.2.2",
+    "vite": "^4.2.1",
+    "vite-plugin-chunk-split": "^0.4.7",
     "vitest": "^0.18.1",
     "vue": "^3.0.4",
     "vue-book": "0.2.0-alpha.0",