add ESM building to devextreme-vue

DevExpress · Sep 13, 2023 · d4486ca · d4486ca
1 parent cbe6320
commit d4486ca
Show file tree

Hide file tree

Showing 2 changed files with 34 additions and 36 deletions.
diff --git a/packages/devextreme-vue/gulpfile.js b/packages/devextreme-vue/gulpfile.js
@@ -19,7 +19,6 @@ const NPM_BUILD = 'npm.build';
 const NPM_BUILD_ESM = 'npm.build-esm';
 const NPM_BUILD_CJS = 'npm.build-cjs';
 const NPM_PREPARE_MODULES = 'npm.prepare-modules';
-const NPM_PREPARE_FOLDERS = 'npm.prepare-folders';
 const NPM_PACK = 'npm.pack';
 const VUE_VERSION = 3;
 
@@ -94,28 +93,32 @@ gulp.task(NPM_BUILD, gulp.series(
 ));
 
 gulp.task(NPM_PREPARE_MODULES, (done) => {
-    const modulesIndex = fs.readFileSync(config.npm.dist + 'esm/index.js', 'utf8');
-
-    [...modulesIndex.matchAll(/from "\.\/([^;]+)";/g)].forEach(([,modulePath]) => {
-        const moduleName = modulePath.match(/[^/]+$/)[0];
-
-        makeModuleForFile(moduleName);
-    })
-
-    done();
-});
-
-gulp.task(NPM_PREPARE_FOLDERS, (done) => {
-    [
+    const packParamsForFolders = [
         ['common'],
+        ['core', ['config']],
         ['common/data']
+    ];
+    const modulesImportsFromIndex = fs.readFileSync(config.npm.dist + 'esm/index.js', 'utf8');
+    const modulesPaths = modulesImportsFromIndex.matchAll(/from "\.\/([^;]+)";/g);
+    const packParamsForModules = [...modulesPaths].map(
+        ([, modulePath]) => {
+            const [,, moduleFilePath, moduleFileName] = modulePath.match(/((.*)\/)?([^/]+$)/);
+
+            return ['', [moduleFileName], moduleFilePath];
+        }
+    );
+
+    [
+        ...packParamsForFolders,
+        ...packParamsForModules,
     ].forEach(
-        ([folder, moduleFileName]) => makeModuleForFolder(folder, moduleFileName)
+        ([folder, moduleFileNames, moduleFilePath]) => makeModule(folder, moduleFileNames, moduleFilePath)
     )
 
     done();
 });
 
+
 gulp.task(ADD_HEADERS, function () {
     const pkg = require('./package.json');
     const now = new Date();
@@ -149,45 +152,41 @@ gulp.task(ADD_HEADERS, function () {
 gulp.task(NPM_PACK, gulp.series(
     NPM_CLEAN,
     NPM_BUILD,
-    gulp.parallel(
-        NPM_PREPARE_MODULES,
-        NPM_PREPARE_FOLDERS,
-    ),
+    NPM_PREPARE_MODULES,
     ADD_HEADERS,
     shell.task(['npm pack'], {cwd: config.npm.dist})
 ));
 
-function makeModuleForFolder(folderPath, moduleFileNames) {
+function makeModule(folder, moduleFileNames, moduleFilePath) {
     const distFolder = path.join(__dirname, config.npm.dist);
-    const distEsmFolder = path.join(distFolder, 'esm', folderPath);
+    const distModuleFolder = path.join(distFolder, folder);
+    const distEsmFolder = path.join(distFolder, 'esm', folder);
     const moduleNames = moduleFileNames || findJsModuleFileNamesInFolder(distEsmFolder);
 
     try {
-        fs.mkdirSync(path.join(distFolder, folderPath));
+        if (!fs.existsSync(distModuleFolder)) {
+            fs.mkdirSync(distModuleFolder);
+        }
 
-        if (fs.existsSync(path.join(distEsmFolder, 'index.js'))) {
-            generatePackageJsonFile(folderPath);
+        if (folder && fs.existsSync(path.join(distEsmFolder, 'index.js'))) {
+            generatePackageJsonFile(folder);
         }
 
         moduleNames.forEach((moduleFileName) => {
-            makeModuleForFile(moduleFileName, folderPath);
+            fs.mkdirSync(path.join(distModuleFolder, moduleFileName));
+
+            generatePackageJsonFile(folder, moduleFileName, moduleFilePath);
         })
     } catch (error) {
-        error.message = `Exception while makeModuleForFolder(${folderPath}).\n ${error.message}`;
+        error.message = `Exception while makeModule(${folder}).\n ${error.message}`;
         throw(error);
     }
 }
 
-function makeModuleForFile(moduleFileName, folder = '') {
-    fs.mkdirSync(path.join(__dirname, config.npm.dist, folder, moduleFileName));
-
-    generatePackageJsonFile(folder, moduleFileName);
-}
-
-function generatePackageJsonFile(folder, moduleFileName) {
+function generatePackageJsonFile(folder, moduleFileName, filePath = folder) {
     const moduleName = moduleFileName || '';
     const absoluteModulePath = path.join(__dirname, config.npm.dist, folder, moduleName);
-    const moduleFilePath = (folder ? folder + '/' : '') + (moduleName || 'index');
+    const moduleFilePath = (filePath ? filePath + '/' : '') + (moduleName || 'index');
     const relativePath = path.relative(
         absoluteModulePath,
         path.join(__dirname, config.npm.dist, 'esm', moduleFilePath + '.js')
@@ -213,4 +212,3 @@ function findJsModuleFileNamesInFolder(dir) {
         }
     ).map((filePath) => path.parse(filePath).name);
 }
-
diff --git a/packages/devextreme-vue/src/core/version.ts b/packages/devextreme-vue/src/core/version.ts
@@ -1,6 +1,6 @@
 import * as VueType from 'vue';
 
-const Vue = VueType[`${'default'}`] || VueType;
+const Vue = (VueType as any).default || VueType;
 
 export function getVueVersion() {
   const currentVersion = Vue.version;