Move components to the root (#173)

.gitignore

@@ -1,6 +1,7 @@
 .vscode/launch.json
 node_modules/
 npm/
-src/ui/
+src/*
+!src/core
 src/index.ts
 tools/bin/

build.config.js

@@ -18,9 +18,11 @@ module.exports = {
     readme: 'README.md'
   },
   metadataPath: './tools/integration-data.json',
-  componentFolder: './src/ui',
+  generatedComponentsDir: './src',
+  oldComponentsDir: './src/ui',
+  coreComponentsDir: './src/core',
   indexFileName: './src/index.ts',
-  baseComponent: '../core/component',
-  configComponent: '../core/configuration-component',
-  extensionComponent: '../core/extension-component'
+  baseComponent: './core/component',
+  configComponent: './core/configuration-component',
+  extensionComponent: './core/extension-component'
 };

example/components/grid-example.vue

@@ -91,7 +91,7 @@ import {
   DxPager,
   DxPaging,
   DxSelection
-} from "../../src/ui/data-grid";
+} from "../../src/data-grid";
 
 import { sales } from "../data";
 

example/components/validation-example.vue

@@ -24,7 +24,7 @@
 import ExampleBlock from "./example-block";
 
 import { DxButton, DxTextBox, DxValidationGroup, DxValidationSummary } from "../../src";
-import { DxValidator, DxEmailRule, DxRequiredRule} from "../../src/ui/validator";
+import { DxValidator, DxEmailRule, DxRequiredRule} from "../../src/validator";
 
 export default {
   components: {

gulpfile.js

@@ -1,9 +1,9 @@
 const mkdir = require('mkdirp');
 const fs = require('fs');
 const path = require('path');
+const del = require('del');
 
 const gulp = require('gulp');
-const clean = require('gulp-clean');
 const shell = require('gulp-shell');
 const header = require('gulp-header');
 const ts = require('gulp-typescript');
@@ -17,7 +17,7 @@ const
   CLEAN = 'clean',
 
   OUTPUTDIR_CLEAN = 'output-dir.clean',
-  OUTPUTDIR_CREATE = 'output-dir.create',
+  OLD_OUTPUTDIR_CREATE = 'output-dir.create',
   GEN_COMPILE = 'generator.compile',
   GEN_CLEAN = 'generator.clean',
   GEN_RUN = 'generator.run',
@@ -27,34 +27,32 @@ const
   NPM_CLEAN = 'npm.clean',
   NPM_PACKAGE = 'npm.package',
   NPM_LICENSE = 'npm.license',
-  NPM_LICENSE_HEADERS = 'npm.license-headers',
+  NPM_BUILD_WITH_HEADERS = 'npm.license-headers',
   NPM_README = 'npm.readme',
   NPM_BUILD = 'npm.build',
   NPM_PACK = 'npm.pack';
 
 gulp.task(GENERATE, (done) =>
   runSequence(
     CLEAN,
-    [OUTPUTDIR_CREATE, GEN_COMPILE],
+    [OLD_OUTPUTDIR_CREATE, GEN_COMPILE],
     GEN_RUN,
     done
   )
 );
 
-gulp.task(CLEAN, [OUTPUTDIR_CLEAN, GEN_CLEAN]);
+gulp.task(CLEAN, [OUTPUTDIR_CLEAN, GEN_CLEAN, NPM_CLEAN]);
 
-gulp.task(OUTPUTDIR_CLEAN, () =>
-  gulp.src([config.componentFolder, config.indexFileName], { read: false })
-    .pipe(clean())
+gulp.task(OUTPUTDIR_CLEAN, (c) =>
+  del([`${config.generatedComponentsDir}\\*`, `!${config.coreComponentsDir}`], c)
 );
 
-gulp.task(GEN_CLEAN, () =>
-  gulp.src(config.generator.binDir, { read: false })
-    .pipe(clean())
+gulp.task(GEN_CLEAN, (c) =>
+  del([config.generator.binDir], c)
 );
 
-gulp.task(OUTPUTDIR_CREATE, (done) =>
-  mkdir(config.componentFolder, {}, done)
+gulp.task(OLD_OUTPUTDIR_CREATE, (done) =>
+  mkdir(config.oldComponentsDir, {}, done)
 );
 
 gulp.task(GEN_COMPILE, [GEN_CLEAN], () =>
@@ -74,7 +72,8 @@ gulp.task(GEN_RUN, (done) => {
     config.configComponent,
     config.extensionComponent,
     {
-      componentsDir: config.componentFolder,
+      componentsDir: config.generatedComponentsDir,
+      oldComponentsDir: config.oldComponentsDir,
       indexFileName: config.indexFileName
     }
   );
@@ -83,9 +82,8 @@ gulp.task(GEN_RUN, (done) => {
 });
 
 
-gulp.task(NPM_CLEAN, () =>
-  gulp.src(config.npm.dist, { read: false })
-    .pipe(clean())
+gulp.task(NPM_CLEAN, (c) =>
+  del(config.npm.dist, c)
 );
 
 gulp.task(NPM_PACKAGE, [NPM_CLEAN], () =>
@@ -112,7 +110,7 @@ gulp.task(NPM_BUILD, [NPM_LICENSE, NPM_PACKAGE, NPM_README, GENERATE], () => {
     .pipe(gulp.dest(config.npm.dist))
 });
 
-gulp.task(NPM_LICENSE_HEADERS, [NPM_BUILD], function() {
+gulp.task(NPM_BUILD_WITH_HEADERS, [NPM_BUILD], function() {
   const pkg = require('./package.json'),
       now = new Date(),
       data = {
@@ -142,7 +140,7 @@ gulp.task(NPM_LICENSE_HEADERS, [NPM_BUILD], function() {
       .pipe(gulp.dest(config.npm.dist));
 });
 
-gulp.task(NPM_PACK, [NPM_LICENSE_HEADERS], shell.task(['npm pack'], { cwd: config.npm.dist }));
+gulp.task(NPM_PACK, [NPM_BUILD_WITH_HEADERS], shell.task(['npm pack'], { cwd: config.npm.dist }));
 
 gulp.task(LINT, () => {
   return gulp.src([config.src, config.generator.src])

package.json

@@ -35,10 +35,10 @@
     "@types/node": "^9.4.7",
     "css-loader": "^0.28.11",
     "dasherize": "^2.0.0",
-    "devextreme": "^18.1.6",
+    "del": "^3.0.0",
+    "devextreme": "^18.1.7-pre-18291",
     "dot": "^1.1.2",
     "gulp": "^3.9.1",
-    "gulp-clean": "^0.4.0",
     "gulp-header": "^2.0.5",
     "gulp-shell": "^0.6.5",
     "gulp-tslint": "^8.1.3",

tools/src/component-generator.ts

@@ -43,6 +43,16 @@ interface IProp {
     isArray?: boolean;
 }
 
+function generateReExport(path: string, fileName: string): string {
+    return renderReExport({ path, fileName });
+}
+
+const renderReExport: (model: {path: string, fileName: string}) => string = createTempate(
+`/** @deprecated Use 'devextreme-vue/<#= it.fileName #>' file instead */\n` +
+`export * from "<#= it.path #>";\n` +
+`export { default } from "<#= it.path #>";\n`
+);
+
 function generate(component: IComponent): string {
     const nestedComponents = component.nestedComponents
         ? component.nestedComponents.map(createNestedComponentModel)
@@ -288,4 +298,4 @@ const renderPropsTemplate: (props: IProp[]) => string = createTempate(
 );
 
 export default generate;
-export { IComponent, INestedComponent, IProp, renderProps };
+export { IComponent, INestedComponent, IProp, renderProps, generateReExport };

tools/src/generator.ts

@@ -1,8 +1,14 @@
 import { writeFileSync as writeFile } from "fs";
-import { dirname as getDirName, join as joinPaths, relative as getRelativePath, sep as pathSeparator } from "path";
+import {
+  dirname as getDirName,
+  join as joinPaths,
+  normalize as normalizePath,
+  relative as getRelativePath,
+  sep as pathSeparator
+} from "path";
 
 import { IComplexProp, ICustomType, IModel, IProp as IOption, ITypeDescr, IWidget } from "../integration-data-model";
-import generateComponent, { IComponent, INestedComponent, IProp } from "./component-generator";
+import generateComponent, { generateReExport, IComponent, INestedComponent, IProp } from "./component-generator";
 import { convertTypes } from "./converter";
 import { removeExtension, removePrefix, toKebabCase, uppercaseFirst } from "./helpers";
 import generateIndex, { IReExport } from "./index-generator";
@@ -14,6 +20,7 @@ function generate(
   extensionComponentPath: string,
   out: {
     componentsDir: string,
+    oldComponentsDir: string,
     indexFileName: string
   }
 ) {
@@ -35,6 +42,15 @@ function generate(
       name: widgetFile.component.name,
       path: "./" + removeExtension(getRelativePath(indexFileDir, widgetFilePath)).replace(pathSeparator, "/")
     });
+
+    writeFile(
+      joinPaths(out.oldComponentsDir, widgetFile.fileName),
+      generateReExport(
+        normalizePath("./" + removeExtension(getRelativePath(out.oldComponentsDir, widgetFilePath)))
+          .replace(pathSeparator, "/"),
+        removeExtension(widgetFile.fileName)
+      )
+    );
   });
 
   writeFile(out.indexFileName, generateIndex(modulePaths), { encoding: "utf8" });