wip(app): nvue styler

packages/uni-app-vite/package.json

@@ -21,6 +21,7 @@
   "dependencies": {
     "@dcloudio/uni-cli-shared": "3.0.0-alpha-3030820220114006",
     "@dcloudio/uni-i18n": "3.0.0-alpha-3030820220114006",
+    "@dcloudio/uni-nvue-styler": "workspace:*",
     "@dcloudio/uni-shared": "3.0.0-alpha-3030820220114006",
     "@rollup/pluginutils": "^4.1.2",
     "@vitejs/plugin-vue": "^2.0.1",

packages/uni-app-vite/src/nvue/plugin/index.ts

+import type { PreRenderedChunk } from 'rollup'
+import type { Plugin } from 'vite'
 import path from 'path'
 import {
   createTransformTag,
@@ -8,8 +10,7 @@ import {
   removeExt,
   resolveMainPathOnce,
 } from '@dcloudio/uni-cli-shared'
-import { PreRenderedChunk } from 'rollup'
-import { Plugin } from 'vite'
+import { parse } from '@dcloudio/uni-nvue-styler'
 import { nvueOutDir } from '../../utils'
 import { transformRenderWhole } from './transforms/transformRenderWhole'
 import { transformAppendAsTree } from './transforms/transformAppendAsTree'
@@ -83,8 +84,14 @@ export function uniAppNVuePlugin(): Plugin {
           return normalizeCssChunkFilename(id)
         }
       },
-      chunkCssCode(_, cssCode) {
-        return 'export default {}'
+      async chunkCssCode(filename, cssCode) {
+        const { code, messages } = await parse(cssCode, { filename })
+        messages.forEach((msg) => {
+          if (msg.type === 'warning' || msg.type === 'error') {
+            console.warn(msg.text)
+          }
+        })
+        return `export default ${code}`
       },
     }),
   }

packages/uni-app-vite/src/nvue/plugins/esbuild.ts

@@ -38,13 +38,11 @@ export function uniEsbuildPlugin(): Plugin {
         }
       })
       debugEsbuild('start', entryPoints.length, entryPoints)
-      await Promise.all(
-        entryPoints.map((filename) => {
-          return buildNVuePage(filename, buildOptions).then((code) => {
-            return fs.outputFile(path.resolve(outputDir, filename), code)
-          })
+      for (const filename of entryPoints) {
+        await buildNVuePage(filename, buildOptions).then((code) => {
+          return fs.outputFile(path.resolve(outputDir, filename), code)
         })
-      )
+      }
       debugEsbuild('end')
     },
   }

packages/uni-app-vite/src/plugin/configResolved.ts

@@ -8,7 +8,7 @@ import {
 
 export function createConfigResolved(options: {
   chunkCssFilename: (id: string) => string | void
-  chunkCssCode: (filename: string, cssCode: string) => string
+  chunkCssCode: (filename: string, cssCode: string) => string | Promise<string>
 }): Plugin['configResolved'] {
   return (config) => {
     injectCssPlugin(config)

packages/uni-cli-shared/src/vite/plugins/vitejs/plugins/css.ts

@@ -220,7 +220,10 @@ export function cssPostPlugin(
     chunkCssCode,
   }: {
     chunkCssFilename: (id: string) => string | void
-    chunkCssCode: (filename: string, cssCode: string) => string
+    chunkCssCode: (
+      filename: string,
+      cssCode: string
+    ) => Promise<string> | string
   }
 ): Plugin {
   // styles initialization in buildStart causes a styling loss in watch

packages/uni-cli-shared/src/vite/utils/plugin.ts

@@ -26,7 +26,10 @@ export function injectCssPostPlugin(
     chunkCssCode,
   }: {
     chunkCssFilename: (id: string) => string | void
-    chunkCssCode: (filename: string, cssCode: string) => string
+    chunkCssCode: (
+      filename: string,
+      cssCode: string
+    ) => string | Promise<string>
   }
 ) {
   const newCssPostPlugin = cssPostPlugin(config, {

packages/uni-nvue-styler/__tests__/normalize.spec.ts

-import { objectifier, parse } from '../src'
+import { parse } from '../src'
 
 async function objectifierRule(input: string) {
-  const { root, messages } = await parse(input, { logLevel: 'NOTE' })
+  const { code, messages } = await parse(input, { logLevel: 'NOTE' })
   return {
-    json: objectifier(root),
+    json: JSON.parse(code),
     messages,
   }
 }

packages/uni-nvue-styler/__tests__/objectifier.spec.ts

-import { objectifier, parse } from '../src'
+import { parse } from '../src'
 
 async function objectifierRoot(input: string) {
-  const { root, messages } = await parse(input, { logLevel: 'NOTE' })
+  const { code, messages } = await parse(input, { logLevel: 'NOTE' })
   return {
-    json: objectifier(root),
+    json: JSON.parse(code),
     messages,
   }
 }

packages/uni-nvue-styler/src/parse.ts

-import postcss from 'postcss'
-import { NormalizeOptions } from './normalize'
-import { expand, normalize } from '../src'
+import postcss, { Message } from 'postcss'
+import { objectifier } from '.'
+import { expand } from './expand'
+import { NormalizeOptions, normalize } from './normalize'
 
 interface ParseOpitons extends NormalizeOptions {
   filename?: string
 }
-export function parse(input: string, options: ParseOpitons = {}) {
-  return postcss([expand, normalize(options)])
+export async function parse(input: string, options: ParseOpitons = {}) {
+  const { root, messages } = await postcss([expand, normalize(options)])
     .process(input, {
       from: options.filename || 'foo.css',
     })
@@ -17,8 +18,12 @@ export function parse(input: string, options: ParseOpitons = {}) {
           {
             type: 'warning',
             text: err.message,
-          },
+          } as Message,
         ],
       }
     })
+  if (root) {
+    return { code: JSON.stringify(objectifier(root)), messages }
+  }
+  return { code: JSON.stringify({}), messages }
 }

pnpm-lock.yaml

@@ -200,6 +200,7 @@ importers:
     specifiers:
       '@dcloudio/uni-cli-shared': 3.0.0-alpha-3030820220114006
       '@dcloudio/uni-i18n': 3.0.0-alpha-3030820220114006
+      '@dcloudio/uni-nvue-styler': workspace:*
       '@dcloudio/uni-shared': 3.0.0-alpha-3030820220114006
       '@rollup/pluginutils': ^4.1.2
       '@types/debug': ^4.1.7
@@ -214,6 +215,7 @@ importers:
     dependencies:
       '@dcloudio/uni-cli-shared': link:../uni-cli-shared
       '@dcloudio/uni-i18n': link:../uni-i18n
+      '@dcloudio/uni-nvue-styler': link:../uni-nvue-styler
       '@dcloudio/uni-shared': link:../uni-shared
       '@rollup/pluginutils': 4.1.2
       '@vitejs/plugin-vue': 2.0.1_vite@2.7.13+vue@3.2.27