wip(app): nvue

packages/uni-app-plus/dist/uni-app-view.umd.js

@@ -3957,7 +3957,8 @@
           unmount(container._vnode, null, null, true);
         }
       } else {
-        patch(container._vnode || null, vnode, container, null, null, null, isSVG);
+        const p2 = container.__vueParent;
+        patch(container._vnode || null, vnode, container, null, p2, null, isSVG);
       }
       container._vnode = vnode;
     };
@@ -16593,6 +16594,9 @@
     publish();
   }
   function onVdSync(actions) {
+    {
+      console.log(formatLog("onVdSync", actions));
+    }
     const firstAction = actions[0];
     if (firstAction[0] === ACTION_TYPE_PAGE_CREATE) {
       onPageCreateSync(firstAction);

packages/uni-app-plus/src/view/framework/dom/index.ts

@@ -11,6 +11,7 @@ import {
   ACTION_TYPE_REMOVE_EVENT,
   ACTION_TYPE_SET_TEXT,
   PageCreateAction,
+  formatLog,
 } from '@dcloudio/uni-shared'
 import { UniNodeJSONMinify } from 'packages/uni-shared/src/vdom/Node'
 import { ACTION_TYPE_DICT, DictAction, Dictionary } from '../../../constants'
@@ -25,6 +26,9 @@ import {
 import { flushPostActionJobs } from './scheduler'
 
 export function onVdSync(actions: (PageAction | DictAction)[]) {
+  if (__DEV__) {
+    console.log(formatLog('onVdSync', actions))
+  }
   const firstAction = actions[0]
   // page create
   if (firstAction[0] === ACTION_TYPE_PAGE_CREATE) {

packages/uni-app-vue/dist/view.runtime.esm.js

@@ -6701,7 +6701,9 @@ function baseCreateRenderer(options, createHydrationFns) {
             }
         }
         else {
-            patch(container._vnode || null, vnode, container, null, null, null, isSVG);
+            // fixed by xxxxxx __vueParent
+            const p = container.__vueParent;
+            patch(container._vnode || null, vnode, container, null, p, null, isSVG);
         }
         // fixed by xxxxxx 调整到UniComponent里边触发flushPostFlushCbs
         // flushPostFlushCbs()

packages/uni-app-vue/lib/view.runtime.esm.js

@@ -6719,7 +6719,9 @@ function baseCreateRenderer(options, createHydrationFns) {
             }
         }
         else {
-            patch(container._vnode || null, vnode, container, null, null, null, isSVG);
+            // fixed by xxxxxx __vueParent
+            const p = container.__vueParent;
+            patch(container._vnode || null, vnode, container, null, p, null, isSVG);
         }
         // fixed by xxxxxx 调整到UniComponent里边触发flushPostFlushCbs
         // flushPostFlushCbs()

packages/uni-cli-nvue/dist/webpack/config/module/rules/index.js

@@ -3,8 +3,19 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.createRules = void 0;
 const babelLoader_1 = require("./babelLoader");
 const cssLoader_1 = require("./cssLoader");
+const recyclableLoader_1 = require("./recyclableLoader");
+const templateLoader_1 = require("./templateLoader");
 const vueLoader_1 = require("./vueLoader");
 function createRules(options) {
-    return [vueLoader_1.createVueLoader(options), babelLoader_1.createBabelLoader(), ...cssLoader_1.createCssLoaders()];
+    const rules = [
+        vueLoader_1.createVueLoader(options),
+        babelLoader_1.createBabelLoader(),
+        recyclableLoader_1.createRecyclableLoader(),
+        ...cssLoader_1.createCssLoaders(),
+    ];
+    if (process.env.UNI_NVUE_COMPILER === 'uni-app') {
+        rules.push(templateLoader_1.createTemplateLoader());
+    }
+    return rules;
 }
 exports.createRules = createRules;

packages/uni-cli-nvue/dist/webpack/config/module/rules/recyclableLoader.js

+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.createRecyclableLoader = void 0;
+const loader_1 = require("../../../loader");
+function createRecyclableLoader() {
+    return {
+        resourceQuery: function (query) {
+            return (query.indexOf('vue&type=template') !== -1 &&
+                query.indexOf('mpType=page') === -1);
+        },
+        use: [{ loader: loader_1.resolveLoader('recyclable') }],
+    };
+}
+exports.createRecyclableLoader = createRecyclableLoader;

packages/uni-cli-nvue/dist/webpack/config/module/rules/templateLoader.js

+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.createTemplateLoader = void 0;
+const loader_1 = require("../../../loader");
+function createTemplateLoader() {
+    return {
+        resourceQuery: function (query) {
+            return (query.indexOf('vue&type=template') !== -1 &&
+                query.indexOf('mpType=page') !== -1);
+        },
+        use: [
+            { loader: loader_1.resolveLoader('scrollView') },
+            {
+                loader: loader_1.resolveLoader('pageMeta'),
+            },
+        ],
+    };
+}
+exports.createTemplateLoader = createTemplateLoader;

packages/uni-cli-nvue/dist/webpack/loader/pageMeta.js

+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+function pageMetaLoader(content, map) {
+    // 简单判断,只要包含 page-meta,就在外层包裹一层 view (vue2 不支持多 root)
+    if (content.indexOf('<page-meta') !== -1) {
+        return this.callback(null, `<view>${content}</view>`, map);
+    }
+    this.callback(null, content, map);
+}
+exports.default = pageMetaLoader;

packages/uni-cli-nvue/dist/webpack/loader/recyclable.js

+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const loaderUtils = require('loader-utils');
+function recyclableLoader(content, map) {
+    const vueLoaderOptions = this.loaders.find((loader) => loader.ident === 'vue-loader-options');
+    if (vueLoaderOptions) {
+        const params = loaderUtils.parseQuery(this.resourceQuery);
+        if (params.recyclable) {
+            ;
+            vueLoaderOptions.options.compilerOptions.recyclable = true;
+        }
+    }
+    else {
+        throw new Error('vue-loader-options parse error');
+    }
+    this.callback(null, content, map);
+}
+exports.default = recyclableLoader;

packages/uni-cli-nvue/dist/webpack/loader/scrollView.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 SCROLLER_COMPONENTS = ['list', 'scroller', 'scroll-view', 'waterfall'];
+function scrollViewLoader(content, map) {
+    const source = content.trim();
+    if (SCROLLER_COMPONENTS.find((name) => source.indexOf('<' + name) === 0)) {
+        return this.callback(null, content, map);
+    }
+    if (source.indexOf('<recycle-list') !== -1) {
+        return this.callback(null, content, map);
+    }
+    let resourcePath = uni_cli_shared_1.removeExt(uni_cli_shared_1.normalizePath(path_1.default.relative(process.env.UNI_INPUT_DIR, this.resourcePath)));
+    if (!process.UNI_NVUE_ENTRY[resourcePath] &&
+        this._module.issuer &&
+        this._module.issuer.issuer) {
+        // <template src=""/>
+        resourcePath = uni_cli_shared_1.removeExt(uni_cli_shared_1.normalizePath(path_1.default.relative(process.env.UNI_INPUT_DIR, this._module.issuer.issuer.resource)));
+    }
+    // 是否 disableScroll
+    // TODO 暂时仅读取一次配置，开发者实时修改页面配置，不会实时生效
+    const pagesJson = uni_cli_shared_1.parsePagesJsonOnce(process.env.UNI_INPUT_DIR, 'app');
+    const pageJson = pagesJson.pages.find((page) => page.path === resourcePath);
+    if (!pageJson) {
+        return this.callback(null, content, map);
+    }
+    if (pageJson.style.disableScroll) {
+        return this.callback(null, content, map);
+    }
+    this.callback(null, `<scroll-view :scroll-y="true" :show-scrollbar="${pageJson.style.scrollIndicator === 'none' ? 'false' : 'true'}" :enableBackToTop="true" bubble="true" style="flex-direction:column">${content}</scroll-view>`, map);
+}
+exports.default = scrollViewLoader;

packages/uni-cli-nvue/src/webpack/config/module/rules/index.ts

 import { RuleSetRule } from 'webpack'
 import { createBabelLoader } from './babelLoader'
 import { createCssLoaders } from './cssLoader'
+import { createRecyclableLoader } from './recyclableLoader'
+import { createTemplateLoader } from './templateLoader'
 import { createVueLoader } from './vueLoader'
 export function createRules(options: NVueCompilerOptions): RuleSetRule[] {
-  return [createVueLoader(options), createBabelLoader(), ...createCssLoaders()]
+  const rules = [
+    createVueLoader(options),
+    createBabelLoader(),
+    createRecyclableLoader(),
+    ...createCssLoaders(),
+  ]
+  if (process.env.UNI_NVUE_COMPILER === 'uni-app') {
+    rules.push(createTemplateLoader())
+  }
+  return rules
 }

packages/uni-cli-nvue/src/webpack/config/module/rules/recyclableLoader.ts

+import { RuleSetRule } from 'webpack'
+import { resolveLoader } from '../../../loader'
+
+export function createRecyclableLoader(): RuleSetRule {
+  return {
+    resourceQuery: function (query) {
+      return (
+        query.indexOf('vue&type=template') !== -1 &&
+        query.indexOf('mpType=page') === -1
+      )
+    },
+    use: [{ loader: resolveLoader('recyclable') }],
+  }
+}

packages/uni-cli-nvue/src/webpack/config/module/rules/templateLoader.ts

+import { RuleSetRule } from 'webpack'
+import { resolveLoader } from '../../../loader'
+
+export function createTemplateLoader(): RuleSetRule {
+  return {
+    resourceQuery: function (query) {
+      return (
+        query.indexOf('vue&type=template') !== -1 &&
+        query.indexOf('mpType=page') !== -1
+      )
+    },
+    use: [
+      { loader: resolveLoader('scrollView') },
+      {
+        loader: resolveLoader('pageMeta'),
+      },
+    ],
+  }
+}

packages/uni-cli-nvue/src/webpack/loader/pageMeta.ts

+import { LoaderContext } from 'webpack'
+
+function pageMetaLoader(this: LoaderContext<{}>, content: string, map: any) {
+  // 简单判断,只要包含 page-meta,就在外层包裹一层 view (vue2 不支持多 root)
+  if (content.indexOf('<page-meta') !== -1) {
+    return this.callback(null, `<view>${content}</view>`, map)
+  }
+  this.callback(null, content, map)
+}
+
+export default pageMetaLoader

packages/uni-cli-nvue/src/webpack/loader/recyclable.ts

+import { LoaderContext } from 'webpack'
+
+const loaderUtils = require('loader-utils')
+
+function recyclableLoader(this: LoaderContext<{}>, content: string, map: any) {
+  const vueLoaderOptions = this.loaders.find(
+    (loader) => loader.ident === 'vue-loader-options'
+  )
+  if (vueLoaderOptions) {
+    const params = loaderUtils.parseQuery(this.resourceQuery)
+    if (params.recyclable) {
+      ;(vueLoaderOptions as any).options.compilerOptions.recyclable = true
+    }
+  } else {
+    throw new Error('vue-loader-options parse error')
+  }
+
+  this.callback(null, content, map)
+}
+
+export default recyclableLoader

packages/uni-cli-nvue/src/webpack/loader/scrollView.ts

+import path from 'path'
+import { LoaderContext } from 'webpack'
+import {
+  removeExt,
+  normalizePath,
+  parsePagesJsonOnce,
+} from '@dcloudio/uni-cli-shared'
+
+const SCROLLER_COMPONENTS = ['list', 'scroller', 'scroll-view', 'waterfall']
+
+function scrollViewLoader(this: LoaderContext<{}>, content: string, map: any) {
+  const source = content.trim()
+  if (SCROLLER_COMPONENTS.find((name) => source.indexOf('<' + name) === 0)) {
+    return this.callback(null, content, map)
+  }
+  if (source.indexOf('<recycle-list') !== -1) {
+    return this.callback(null, content, map)
+  }
+
+  let resourcePath = removeExt(
+    normalizePath(path.relative(process.env.UNI_INPUT_DIR, this.resourcePath))
+  )
+
+  if (
+    !process.UNI_NVUE_ENTRY[resourcePath] &&
+    (this as any)._module.issuer &&
+    (this as any)._module.issuer.issuer
+  ) {
+    // <template src=""/>
+    resourcePath = removeExt(
+      normalizePath(
+        path.relative(
+          process.env.UNI_INPUT_DIR,
+          (this as any)._module.issuer.issuer.resource
+        )
+      )
+    )
+  }
+
+  // 是否 disableScroll
+  // TODO 暂时仅读取一次配置，开发者实时修改页面配置，不会实时生效
+  const pagesJson = parsePagesJsonOnce(process.env.UNI_INPUT_DIR, 'app')
+  const pageJson = pagesJson.pages.find((page) => page.path === resourcePath)
+  if (!pageJson) {
+    return this.callback(null, content, map)
+  }
+
+  if (pageJson.style.disableScroll) {
+    return this.callback(null, content, map)
+  }
+
+  this.callback(
+    null,
+    `<scroll-view :scroll-y="true" :show-scrollbar="${
+      (pageJson.style as any).scrollIndicator === 'none' ? 'false' : 'true'
+    }" :enableBackToTop="true" bubble="true" style="flex-direction:column">${content}</scroll-view>`,
+    map
+  )
+}
+
+export default scrollViewLoader

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

@@ -39,3 +39,11 @@ export function normalizePagePath(pagePath: string, platform: UniApp.PLATFORM) {
   }
   console.error(`${pagePath} not found`)
 }
+
+export function removeExt(str: string, ext?: string) {
+  if (ext) {
+    const reg = new RegExp(ext.replace(/\./, '\\.') + '$')
+    return normalizePath(str.replace(reg, ''))
+  }
+  return normalizePath(str.replace(/\.\w+$/g, ''))
+}