wip(app): nvue

packages/shims-node.d.ts

@@ -3,6 +3,7 @@ declare namespace NodeJS {
     UNI_NVUE_ENTRY: Record<string, string>
   }
   interface ProcessEnv {
+    NODE_ENV: 'production' | 'development' | 'test'
     UNI_PLATFORM: UniApp.PLATFORM
     UNI_INPUT_DIR: string
     UNI_OUTPUT_DIR: string

packages/uni-app-vite/dist/plugin/build.js

@@ -4,10 +4,16 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.buildOptions = void 0;
+const fs_1 = __importDefault(require("fs"));
 const path_1 = __importDefault(require("path"));
 const uni_cli_shared_1 = require("@dcloudio/uni-cli-shared");
 function buildOptions() {
+    // 开始编译时，清空输出目录
+    if (fs_1.default.existsSync(process.env.UNI_OUTPUT_DIR)) {
+        uni_cli_shared_1.emptyDir(process.env.UNI_OUTPUT_DIR);
+    }
     return {
+        emptyOutDir: false,
         assetsInlineLimit: 0,
         rollupOptions: {
             input: uni_cli_shared_1.resolveMainPathOnce(process.env.UNI_INPUT_DIR),

packages/uni-app-vite/dist/plugins/copy.js

@@ -8,6 +8,7 @@ const path_1 = __importDefault(require("path"));
 const uni_cli_shared_1 = require("@dcloudio/uni-cli-shared");
 function uniCopyPlugin() {
     return uni_cli_shared_1.uniViteCopyPlugin({
+        copyOnce: true,
         targets: [
             {
                 src: uni_cli_shared_1.normalizePath(path_1.default.resolve(__dirname, '../../lib/template/*.js')),
@@ -17,6 +18,10 @@ function uniCopyPlugin() {
                 src: uni_cli_shared_1.normalizePath(path_1.default.resolve(__dirname, '../../lib/template/*.png')),
                 dest: process.env.UNI_OUTPUT_DIR,
             },
+            {
+                src: uni_cli_shared_1.normalizePath(require.resolve('@dcloudio/uni-app-plus/dist/uni-app-view.umd.js')),
+                dest: process.env.UNI_OUTPUT_DIR,
+            },
             {
                 src: uni_cli_shared_1.normalizePath(path_1.default.resolve(__dirname, '../../lib/template/__uniappview.html')),
                 dest: process.env.UNI_OUTPUT_DIR,
@@ -34,10 +39,6 @@ function uniCopyPlugin() {
                         .replace('/*__uniConfig*/', `var __uniConfig = ${JSON.stringify(__uniConfig)}`);
                 },
             },
-            {
-                src: uni_cli_shared_1.normalizePath(require.resolve('@dcloudio/uni-app-plus/dist/uni-app-view.umd.js')),
-                dest: process.env.UNI_OUTPUT_DIR,
-            },
         ],
         hook: 'writeBundle',
         verbose: process.env.DEBUG ? true : false,

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

+import fs from 'fs'
 import path from 'path'
 import { UserConfig } from 'vite'
 
-import { normalizePath, resolveMainPathOnce } from '@dcloudio/uni-cli-shared'
+import {
+  emptyDir,
+  normalizePath,
+  resolveMainPathOnce,
+} from '@dcloudio/uni-cli-shared'
 
 export function buildOptions(): UserConfig['build'] {
+  // 开始编译时，清空输出目录
+  if (fs.existsSync(process.env.UNI_OUTPUT_DIR)) {
+    emptyDir(process.env.UNI_OUTPUT_DIR)
+  }
   return {
+    emptyOutDir: false, // 不清空输出目录，否则会影响 webpack 的输出
     assetsInlineLimit: 0,
     rollupOptions: {
       input: resolveMainPathOnce(process.env.UNI_INPUT_DIR),

packages/uni-app-vite/src/plugins/copy.ts

@@ -8,6 +8,7 @@ import {
 
 export function uniCopyPlugin() {
   return uniViteCopyPlugin({
+    copyOnce: true, // 仅copy一次，不支持动态更新 rpxCalcMaxDeviceWidth，rpxCalcBaseDeviceWidth
     targets: [
       {
         src: normalizePath(path.resolve(__dirname, '../../lib/template/*.js')),
@@ -17,6 +18,12 @@ export function uniCopyPlugin() {
         src: normalizePath(path.resolve(__dirname, '../../lib/template/*.png')),
         dest: process.env.UNI_OUTPUT_DIR,
       },
+      {
+        src: normalizePath(
+          require.resolve('@dcloudio/uni-app-plus/dist/uni-app-view.umd.js')
+        ),
+        dest: process.env.UNI_OUTPUT_DIR,
+      },
       {
         src: normalizePath(
           path.resolve(__dirname, '../../lib/template/__uniappview.html')
@@ -42,12 +49,6 @@ export function uniCopyPlugin() {
             )
         },
       },
-      {
-        src: normalizePath(
-          require.resolve('@dcloudio/uni-app-plus/dist/uni-app-view.umd.js')
-        ),
-        dest: process.env.UNI_OUTPUT_DIR,
-      },
     ],
     hook: 'writeBundle',
     verbose: process.env.DEBUG ? true : false,

packages/uni-cli-nvue/dist/plugin.js

+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const path_1 = __importDefault(require("path"));
+const uni_cli_shared_1 = require("@dcloudio/uni-cli-shared");
+const webpack_1 = require("./webpack");
+const UniAppNVuePlugin = () => {
+    let pagesJsonPath;
+    let watching;
+    let lastNVueEntry;
+    let isPagesJsonChanged = false;
+    return {
+        name: 'vite:uni-cli-nvue',
+        config() {
+            if (process.env.UNI_NVUE_COMPILER === 'vue') {
+                return;
+            }
+            pagesJsonPath = uni_cli_shared_1.normalizePath(path_1.default.resolve(process.env.UNI_INPUT_DIR, 'pages.json'));
+            if (process.env.NODE_ENV === 'production') {
+                webpack_1.runWebpackBuild();
+            }
+            else {
+                webpack_1.runWebpackDev().then((compiler) => {
+                    watching = compiler.watching;
+                });
+            }
+        },
+        configResolved() {
+            if (process.env.UNI_NVUE_COMPILER === 'vue') {
+                return;
+            }
+            const entry = process.UNI_NVUE_ENTRY;
+            if (entry) {
+                lastNVueEntry = JSON.stringify(Object.keys(entry));
+            }
+        },
+        watchChange(id) {
+            if (process.env.UNI_NVUE_COMPILER === 'vue') {
+                return;
+            }
+            if (pagesJsonPath === id && watching) {
+                isPagesJsonChanged = true;
+            }
+        },
+        generateBundle() {
+            if (!isPagesJsonChanged) {
+                return;
+            }
+            const entry = process.UNI_NVUE_ENTRY;
+            if (!entry) {
+                return;
+            }
+            const curNVueEntry = JSON.stringify(Object.keys(entry));
+            console.log('watchChange', lastNVueEntry, curNVueEntry);
+            if (curNVueEntry !== lastNVueEntry) {
+                lastNVueEntry = curNVueEntry;
+                console.log('invalidate');
+                watching.invalidate();
+            }
+        },
+    };
+};
+exports.default = [UniAppNVuePlugin()];

packages/uni-cli-nvue/dist/webpack/config/entry.js

@@ -2,6 +2,6 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.createEntry = void 0;
 function createEntry() {
-    return process.UNI_NVUE_ENTRY;
+    return () => process.UNI_NVUE_ENTRY;
 }
 exports.createEntry = createEntry;

packages/uni-cli-nvue/dist/webpack/config/optimization.js

@@ -9,6 +9,7 @@ function createOptimization() {
     return {
         nodeEnv: false,
         moduleIds: 'deterministic',
+        chunkIds: 'deterministic',
         minimizer: [
             new terser_webpack_plugin_1.default({
                 terserOptions: {

packages/uni-cli-nvue/dist/webpack/index.js

@@ -12,7 +12,7 @@ const initModuleAliasOnce = uni_shared_1.once(alias_1.initModuleAlias);
 function runWebpack(mode, options) {
     initModuleAliasOnce();
     return new Promise((resolve, reject) => {
-        webpack_1.default(config_1.createConfig(mode, options), (err, stats) => {
+        const compiler = webpack_1.default(config_1.createConfig(mode, options), (err, stats) => {
             if (err) {
                 return reject(err.stack || err);
             }
@@ -23,21 +23,23 @@ function runWebpack(mode, options) {
                 const info = stats.toJson({ all: false, warnings: true });
                 console.warn(info.warnings);
             }
-            console.log(stats.toString({
-                all: false,
-                assets: true,
-                colors: true, // 在控制台展示颜色
-                // timings: true,
-            }));
-            resolve(void 0);
+            if (process.env.DEBUG) {
+                console.log(stats.toString({
+                    all: false,
+                    assets: true,
+                    colors: true, // 在控制台展示颜色
+                    // timings: true,
+                }));
+            }
+            resolve(compiler);
         });
     });
 }
-function runWebpackBuild(options) {
+function runWebpackBuild(options = {}) {
     return runWebpack('production', options);
 }
 exports.runWebpackBuild = runWebpackBuild;
-function runWebpackDev(options) {
+function runWebpackDev(options = {}) {
     return runWebpack('development', options);
 }
 exports.runWebpackDev = runWebpackDev;

packages/uni-cli-nvue/package.json

@@ -17,6 +17,11 @@
   "scripts": {
     "test": "echo \"Error: no test specified\" && exit 1"
   },
+  "uni-app": {
+    "name": "uni-cli-nvue",
+    "apply": "app",
+    "main": "dist/plugin.js"
+  },
   "license": "Apache-2.0",
   "gitHead": "4dd0e035b52584ff028ee3028c46adc555be0529",
   "dependencies": {

packages/uni-cli-nvue/src/plugin.ts

+import path from 'path'
+import { UniVitePlugin, normalizePath } from '@dcloudio/uni-cli-shared'
+import { runWebpackBuild, runWebpackDev } from './webpack'
+import { Watching } from 'webpack'
+
+const UniAppNVuePlugin = (): UniVitePlugin => {
+  let pagesJsonPath: string
+  let watching: Watching
+  let lastNVueEntry: string
+  let isPagesJsonChanged: boolean = false
+  return {
+    name: 'vite:uni-cli-nvue',
+    config() {
+      if (process.env.UNI_NVUE_COMPILER === 'vue') {
+        return
+      }
+      pagesJsonPath = normalizePath(
+        path.resolve(process.env.UNI_INPUT_DIR, 'pages.json')
+      )
+      if (process.env.NODE_ENV === 'production') {
+        runWebpackBuild()
+      } else {
+        runWebpackDev().then((compiler) => {
+          watching = compiler.watching
+        })
+      }
+    },
+    configResolved() {
+      if (process.env.UNI_NVUE_COMPILER === 'vue') {
+        return
+      }
+      const entry = process.UNI_NVUE_ENTRY
+      if (entry) {
+        lastNVueEntry = JSON.stringify(Object.keys(entry))
+      }
+    },
+    watchChange(id) {
+      if (process.env.UNI_NVUE_COMPILER === 'vue') {
+        return
+      }
+
+      if (pagesJsonPath === id && watching) {
+        isPagesJsonChanged = true
+      }
+    },
+    generateBundle() {
+      if (!isPagesJsonChanged) {
+        return
+      }
+      const entry = process.UNI_NVUE_ENTRY
+      if (!entry) {
+        return
+      }
+      const curNVueEntry = JSON.stringify(Object.keys(entry))
+      console.log('watchChange', lastNVueEntry, curNVueEntry)
+      if (curNVueEntry !== lastNVueEntry) {
+        lastNVueEntry = curNVueEntry
+        console.log('invalidate')
+        watching.invalidate()
+      }
+    },
+  }
+}
+
+export default [UniAppNVuePlugin()]

packages/uni-cli-nvue/src/webpack/config/entry.ts

 export function createEntry() {
-  return process.UNI_NVUE_ENTRY
+  return () => process.UNI_NVUE_ENTRY
 }

packages/uni-cli-nvue/src/webpack/index.ts

@@ -11,8 +11,8 @@ function runWebpack(
   options: NVueCompilerOptions
 ) {
   initModuleAliasOnce()
-  return new Promise((resolve, reject) => {
-    webpack(createConfig(mode, options), (err, stats) => {
+  return new Promise<webpack.Compiler>((resolve, reject) => {
+    const compiler = webpack(createConfig(mode, options), (err, stats) => {
       if (err) {
         return reject(err.stack || err)
       }
@@ -25,23 +25,25 @@ function runWebpack(
         const info = stats!.toJson({ all: false, warnings: true })
         console.warn(info.warnings)
       }
-      console.log(
-        stats!.toString({
-          all: false,
-          assets: true,
-          colors: true, // 在控制台展示颜色
-          // timings: true,
-        })
-      )
-      resolve(void 0)
+      if (process.env.DEBUG) {
+        console.log(
+          stats!.toString({
+            all: false,
+            assets: true,
+            colors: true, // 在控制台展示颜色
+            // timings: true,
+          })
+        )
+      }
+      resolve(compiler)
     })
   })
 }
 
-export function runWebpackBuild(options: NVueCompilerOptions) {
+export function runWebpackBuild(options: NVueCompilerOptions = {}) {
   return runWebpack('production', options)
 }
 
-export function runWebpackDev(options: NVueCompilerOptions) {
+export function runWebpackDev(options: NVueCompilerOptions = {}) {
   return runWebpack('development', options)
 }

packages/uni-cli-shared/src/fs.ts

+import fs from 'fs'
+import path from 'path'
+export function emptyDir(dir: string, skip?: string[]): void {
+  for (const file of fs.readdirSync(dir)) {
+    if (skip?.includes(file)) {
+      continue
+    }
+    const abs = path.resolve(dir, file)
+    // baseline is Node 12 so can't use rmSync :(
+    if (fs.lstatSync(abs).isDirectory()) {
+      emptyDir(abs)
+      fs.rmdirSync(abs)
+    } else {
+      fs.unlinkSync(abs)
+    }
+  }
+}

packages/uni-cli-shared/src/index.ts

+export * from './fs'
 export * from './env'
 export * from './hbx'
 export * from './logs'

packages/uni-cli-shared/src/json/app/manifest/index.ts

@@ -36,6 +36,7 @@ export function normalizeAppManifestJson(
 }
 
 export {
+  getRenderer,
   getNVueCompiler,
   getNVueStyleCompiler,
   getNVueFlexDirection,

packages/vite-plugin-uni/src/cli/action.ts

@@ -3,7 +3,6 @@ import { RollupWatcher } from 'rollup'
 import { BuildOptions, ServerOptions } from 'vite'
 import { CliOptions } from '.'
 import { build, buildSSR } from './build'
-import { runNVue } from './nvue'
 import { createServer, createSSRServer } from './server'
 import { initEnv } from './utils'
 
@@ -17,13 +16,11 @@ export async function runDev(options: CliOptions & ServerOptions) {
       const watcher = (await build(options)) as RollupWatcher
       watcher.on('event', (event) => {
         if (event.code === 'BUNDLE_END') {
+          event.result.close()
           console.log(`DONE  Build complete. Watching for changes...`)
         }
       })
     }
-    if (options.platform === 'app') {
-      await runNVue('dev')
-    }
   } catch (e) {
     console.error(`error when starting dev server:\n${e.stack || e}`)
     process.exit(1)
@@ -36,9 +33,6 @@ export async function runBuild(options: CliOptions & BuildOptions) {
     await (options.ssr && options.platform === 'h5'
       ? buildSSR(options)
       : build(options))
-    if (options.platform === 'app') {
-      await runNVue('prod')
-    }
     console.log(`DONE  Build complete.`)
   } catch (e) {
     console.error(`error during build:\n${e.stack || e}`)

packages/vite-plugin-uni/src/cli/nvue.ts

 import {
   parseManifestJsonOnce,
+  getRenderer,
   getNVueCompiler,
   getNVueStyleCompiler,
 } from '@dcloudio/uni-cli-shared'
-import { getRenderer } from '../../../uni-cli-shared/dist/json/app/manifest/nvue'
 
 export function initNVueEnv() {
   const manifestJson = parseManifestJsonOnce(process.env.UNI_INPUT_DIR)
@@ -20,32 +20,3 @@ export function initNVueEnv() {
     process.env.UNI_NVUE_STYLE_COMPILER = 'uni-app'
   }
 }
-
-export async function runNVue(mode: 'prod' | 'dev') {
-  let hasCliNVue = false
-  try {
-    if (require.resolve('@dcloudio/uni-cli-nvue')) {
-      hasCliNVue = true
-    }
-  } catch (e) {}
-  if (!hasCliNVue) {
-    return
-  }
-  let nvue
-  try {
-    nvue = require('@dcloudio/uni-cli-nvue')
-  } catch (e) {
-    console.error(e)
-  }
-  if (!nvue) {
-    return
-  }
-  if (process.env.UNI_NVUE_COMPILER === 'vue') {
-    return
-  }
-  if (mode === 'prod') {
-    await nvue.runWebpackBuild()
-  } else {
-    await nvue.runWebpackDev()
-  }
-}