chore(cli): rename some files

packages/vant-cli/site/desktop/App.vue

@@ -8,7 +8,7 @@
 
 <script>
 import VanDoc from './components';
-import { config } from 'desktop-entry';
+import { config } from 'site-desktop-shared';
 
 export default {
   components: {

packages/vant-cli/site/desktop/router.js

@@ -1,5 +1,5 @@
 import decamelize from 'decamelize';
-import { documents } from 'desktop-entry';
+import { documents } from 'site-desktop-shared';
 
 const routes = [];
 const names = Object.keys(documents);

packages/vant-cli/site/mobile/components/DemoHome.vue

@@ -16,7 +16,7 @@
 </template>
 
 <script>
-import { config } from 'mobile-entry';
+import { config } from 'site-mobile-shared';
 import DemoHomeNav from './DemoHomeNav';
 
 export default {

packages/vant-cli/site/mobile/router.js

@@ -1,6 +1,6 @@
 import decamelize from 'decamelize';
 import DemoHome from './components/DemoHome';
-import { demos } from 'mobile-entry';
+import { demos } from 'site-mobile-shared';
 
 const routes = [];
 const names = Object.keys(demos);

packages/vant-cli/src/commands/build.ts

@@ -7,8 +7,9 @@ import { remove, copy, readdirSync } from 'fs-extra';
 import { compileJs } from '../compiler/compile-js';
 import { compileSfc } from '../compiler/compile-sfc';
 import { compileStyle } from '../compiler/compile-style';
-import { genStyleEntry } from '../compiler/gen-style-entry';
 import { genPackageEntry } from '../compiler/gen-package-entry';
+import { genStyleDepsMap } from '../compiler/gen-style-deps-map';
+import { genComponentStyle } from '../compiler/gen-component-style';
 import { SRC_DIR, LIB_DIR, ES_DIR } from '../common/constant';
 import {
   isDir,
@@ -99,7 +100,8 @@ export async function buildStyleEntry() {
   start('Build style entry');
 
   try {
-    genStyleEntry();
+    genStyleDepsMap();
+    genComponentStyle();
     success('Build style entry');
   } catch (err) {
     error('Build style entry');

packages/vant-cli/src/commands/dev.ts

@@ -6,9 +6,9 @@ import { buildESModuleOutputs } from './build';
 import { siteDevConfig } from '../config/webpack.site.dev';
 import { genPackageEntry } from '../compiler/gen-package-entry';
 import { genPacakgeStyle } from '../compiler/gen-package-style';
-import { genMobileEntry } from '../compiler/gen-mobile-entry';
-import { genDesktopEntry } from '../compiler/gen-desktop-entry';
-import { genDepsMap } from '../compiler/gen-style-deps-map';
+import { genSiteMobileShared } from '../compiler/gen-site-mobile-shared';
+import { genSiteDesktopShared } from '../compiler/gen-site-desktop-shared';
+import { genStyleDepsMap } from '../compiler/gen-style-deps-map';
 
 function runWebpack() {
   const server = new WebpackDevServer(
@@ -38,10 +38,10 @@ function runWebpack() {
 export async function dev() {
   await clean();
   await buildESModuleOutputs();
-  genDepsMap();
+  genStyleDepsMap();
   genPackageEntry();
   genPacakgeStyle();
-  genMobileEntry();
-  genDesktopEntry();
+  genSiteMobileShared();
+  genSiteDesktopShared();
   runWebpack();
 }

packages/vant-cli/src/common/constant.ts

@@ -14,8 +14,8 @@ export const CONFIG_DIR = join(__dirname, '../config');
 
 export const PACKAGE_ENTRY_FILE = join(DIST_DIR, 'package-entry.js');
 export const PACKAGE_STYLE_FILE = join(DIST_DIR, 'package-style.css');
-export const MOBILE_ENTRY_FILE = join(DIST_DIR, 'mobile-entry.js');
-export const DESKTOP_ENTRY_FILE = join(DIST_DIR, 'desktop-entry.js');
+export const MOBILE_ENTRY_FILE = join(DIST_DIR, 'site-mobile-shared.js');
+export const DESKTOP_ENTRY_FILE = join(DIST_DIR, 'site-desktop-shared.js');
 export const STYPE_DEPS_JSON_FILE = join(DIST_DIR, 'style-deps.json');
 
 export const JEST_CONFIG_FILE = join(CONFIG_DIR, 'jest.config.js');

packages/vant-cli/src/compiler/gen-component-style.ts

@@ -0,0 +1,55 @@
+/**
+ * Build style entry of all components
+ */
+
+import { join, relative } from 'path';
+import { outputFileSync } from 'fs-extra';
+import { getComponents } from '../common';
+import { getStyleExt } from './gen-package-style';
+import { ES_DIR, LIB_DIR, STYPE_DEPS_JSON_FILE } from '../common/constant';
+
+function getDeps(component: string): string[] {
+  // eslint-disable-next-line
+  const styleDepsJson = require(STYPE_DEPS_JSON_FILE);
+
+  if (styleDepsJson.map[component]) {
+    return [...styleDepsJson.map[component], component];
+  }
+
+  return [];
+}
+
+function getPath(component: string, ext = '.css') {
+  return join(ES_DIR, `${component}/index${ext}`);
+}
+
+function getRelativePath(component: string, style: string, ext: string) {
+  return relative(join(ES_DIR, `${component}/style`), getPath(style, ext));
+}
+
+function genEntry(component: string, filename: string, ext = '') {
+  const deps = getDeps(component);
+  const depsPath = deps.map(dep => getRelativePath(component, dep, ext));
+
+  const esEntry = join(ES_DIR, component, `style/${filename}`);
+  const libEntry = join(LIB_DIR, component, `style/${filename}`);
+
+  const esContent = depsPath.map(dep => `import '${dep}';`).join('\n');
+  const libContent = depsPath.map(dep => `require('${dep}');`).join('\n');
+
+  outputFileSync(esEntry, esContent);
+  outputFileSync(libEntry, libContent);
+}
+
+export function genComponentStyle() {
+  const ext = getStyleExt();
+  const components = getComponents();
+
+  components.forEach(component => {
+    genEntry(component, 'index.js', '.css');
+
+    if (ext !== 'css') {
+      genEntry(component, ext + '.js', '.' + ext);
+    }
+  });
+}

packages/vant-cli/src/compiler/gen-package-style.ts

@@ -9,21 +9,22 @@ import {
   STYPE_DEPS_JSON_FILE
 } from '../common/constant';
 
-// eslint-disable-next-line
-const styleDepsJson = require(STYPE_DEPS_JSON_FILE);
-
-function getStyleExt(): string {
+export function getStyleExt(): string {
   const preprocessor = get(CONFIG, 'build.css.preprocessor', 'less');
 
   if (preprocessor === 'sass') {
-    return '.scss';
+    return 'scss';
   }
 
-  return `.${preprocessor}`;
+  return preprocessor;
 }
 
 export function genPacakgeStyle() {
-  const ext = getStyleExt();
+  // eslint-disable-next-line
+  const styleDepsJson = require(STYPE_DEPS_JSON_FILE);
+
+  const ext = '.' + getStyleExt();
+
   const content = styleDepsJson.sequence
     .map((name: string) => `@import "${join(SRC_DIR, `${name}/index${ext}`)}";`)
     .join('\n');

packages/vant-cli/src/compiler/gen-site-desktop-shared.ts

@@ -53,7 +53,7 @@ function genExportConfig() {
   return 'export { config };';
 }
 
-export function genDesktopEntry() {
+export function genSiteDesktopShared() {
   const components = getComponents();
   const documents = resolveDocuments(components);
 

packages/vant-cli/src/compiler/gen-site-mobile-shared.ts

@@ -61,7 +61,7 @@ function genCode(components: string[]) {
   )}\n${genConfig(demos)}\n`;
 }
 
-export function genMobileEntry() {
+export function genSiteMobileShared() {
   const components = getComponents();
   const code = genCode(components);
 

packages/vant-cli/src/compiler/gen-style-deps-map.ts

@@ -61,52 +61,53 @@ function analyzeDeps(component: string) {
 
 type DepsMap = Record<string, string[]>;
 
-function sortComponentsByDeps(depsMap: DepsMap) {
-  const result: string[] = [];
-  const record: string[] = [];
+function getSequence(depsMap: DepsMap) {
+  const sequence: string[] = [];
+  const record = new Set();
 
   function add(item: string) {
     const deps = depsMap[item];
 
-    if (result.includes(item) || !deps) {
+    if (sequence.includes(item) || !deps) {
       return;
     }
 
-    if (record.includes(item)) {
-      result.push(item);
+    if (record.has(item)) {
+      sequence.push(item);
       return;
     }
 
-    record.push(item);
+    record.add(item);
 
     if (!deps.length) {
-      result.push(item);
+      sequence.push(item);
       return;
     }
 
     deps.forEach(add);
 
-    if (result.includes(item)) {
+    if (sequence.includes(item)) {
       return;
     }
 
-    const maxIndex = Math.max(...deps.map(dep => result.indexOf(dep)));
+    const maxIndex = Math.max(...deps.map(dep => sequence.indexOf(dep)));
 
-    result.splice(maxIndex + 1, 0, item);
+    sequence.splice(maxIndex + 1, 0, item);
   }
 
   components.forEach(add);
 
-  return result;
+  return sequence;
 }
 
-export function genDepsMap() {
-  const map = components.filter(checkStyleExists).reduce((map, component) => {
-    map[component] = analyzeDeps(component);
-    return map;
-  }, {} as DepsMap);
+export function genStyleDepsMap() {
+  const map = {} as DepsMap;
 
-  const sequence = sortComponentsByDeps(map);
+  components.filter(checkStyleExists).forEach(component => {
+    map[component] = analyzeDeps(component);
+  });
+
+  const sequence = getSequence(map);
 
   Object.keys(map).forEach(key => {
     map[key] = map[key].sort(

packages/vant-cli/src/compiler/gen-style-entry.ts

@@ -1,98 +0,0 @@
-/* eslint-disable no-use-before-define */
-/**
- * Build style entry of all components
- */
-
-import { sep, join, relative } from 'path';
-import { existsSync, outputFileSync } from 'fs-extra';
-import { getComponents } from '../common';
-import { ES_DIR, LIB_DIR } from '../common/constant';
-import dependencyTree from 'dependency-tree';
-
-interface DependencyObj {
-  [k: string]: DependencyObj;
-}
-
-const components = getComponents();
-
-// replace seq for windows
-function replaceSeq(path: string) {
-  return path.split(sep).join('/');
-}
-
-function genEntry(component: string, filename: string, ext = '') {
-  const deps = analyzeDeps(component).map(dep =>
-    getStyleRelativePath(component, dep, ext)
-  );
-
-  const esEntry = join(ES_DIR, component, `style/${filename}`);
-  const libEntry = join(LIB_DIR, component, `style/${filename}`);
-
-  const esContent = deps.map(dep => `import '${dep}';`).join('\n');
-  const libContent = deps.map(dep => `require('${dep}');`).join('\n');
-
-  outputFileSync(esEntry, esContent);
-  outputFileSync(libEntry, libContent);
-}
-
-// analyze component dependencies
-function analyzeDeps(component: string) {
-  const checkList = ['base'];
-
-  search(
-    dependencyTree({
-      directory: ES_DIR,
-      filename: join(ES_DIR, component, 'index.js'),
-      filter: path => !~path.indexOf('node_modules')
-    }),
-    component,
-    checkList
-  );
-
-  checkList.push(component);
-
-  return checkList.filter(checkStyleExists);
-}
-
-function search(tree: DependencyObj, component: string, checkList: string[]) {
-  Object.keys(tree).forEach(key => {
-    search(tree[key], component, checkList);
-    components
-      .filter(item =>
-        key
-          .replace(ES_DIR, '')
-          .split('/')
-          .includes(item)
-      )
-      .forEach(item => {
-        if (!checkList.includes(item) && item !== component) {
-          checkList.push(item);
-        }
-      });
-  });
-}
-
-function getStylePath(component: string, ext = '.css') {
-  if (component === 'base') {
-    return join(ES_DIR, `style/base${ext}`);
-  }
-
-  return join(ES_DIR, `${component}/index${ext}`);
-}
-
-function getStyleRelativePath(component: string, style: string, ext: string) {
-  return replaceSeq(
-    relative(join(ES_DIR, `${component}/style`), getStylePath(style, ext))
-  );
-}
-
-function checkStyleExists(component: string) {
-  return existsSync(getStylePath(component));
-}
-
-export function genStyleEntry() {
-  components.forEach(component => {
-    genEntry(component, 'index.js', '.css');
-    genEntry(component, 'less.js', '.less');
-  });
-}

packages/vant-cli/src/config/webpack.site.dev.ts

@@ -23,8 +23,8 @@ export const siteDevConfig = merge(
     },
     resolve: {
       alias: {
-        'mobile-entry': MOBILE_ENTRY_FILE,
-        'desktop-entry': DESKTOP_ENTRY_FILE
+        'site-mobile-shared': MOBILE_ENTRY_FILE,
+        'site-desktop-shared': DESKTOP_ENTRY_FILE
       }
     },
     output: {