Move bundles out of js folder

packages/devextreme-themebuilder/src/metadata/dependency-collector.ts

@@ -98,8 +98,12 @@ export default class DependencyCollector {
         es6: { mixedImports: true },
         ts: { skipTypeImports : true }
       });
+      const isBundleFile = filePath.includes('bundle-templates');
 
-      const deps = result.map((relativeDependency: string): string => {
+      const deps = result.map((dependency: string): string => {
+        const relativeDependency = isBundleFile
+          ? dependency.replace(/^((?:\.\.\/)+)(?!bundles)/, '$1../js/')
+          : dependency;
         let absDepPath = relativeDependency
 
         if (relativeDependency.startsWith('.')) {
@@ -176,7 +180,7 @@ export default class DependencyCollector {
   }
 
   collect(): void {
-    const fullDependencyTree = this.getFullDependencyTree(path.resolve(__dirname, '../../../devextreme/js/bundles/dx.all.js'));
+    const fullDependencyTree = this.getFullDependencyTree(path.resolve(__dirname, '../../../devextreme/build/bundle-templates/dx.all.js'));
 
     this.treeProcessor(fullDependencyTree);
     this.validate();

packages/devextreme-themebuilder/tests/metadata/dependency-collector.test.ts

@@ -105,7 +105,9 @@ const filesContent: { [key: string]: string } = {
   [path.resolve(__dirname, '../../../devextreme-scss/scss/widgets/lesstheme/_index.scss')]: '// public widgets\n@use "./toolbar";',
 
   // collect test
-  [path.resolve(__dirname, '../../../devextreme/js/bundles/dx.all.js')]: 'import t from \'./toolbar\';import b from \'./button\';',
+  [path.resolve(__dirname, '../../../devextreme/build/bundle-templates/dx.all.js')]: 'import t from \'../toolbar\';import b from \'../button\';',
+  '../../js/toolbar.js': 'import m from \'./menu\';import u from \'./utils\';\n// STYLE toolbar',
+  '../../js/button.js': 'import u from \'./utils\';\n// STYLE button',
   [path.resolve(__dirname, '../../../devextreme-scss/scss/widgets/generic/_index.scss')]: '// public widgets\n@use "./toolbar";@use "./button";@use "./icon";@use "./menu";',
   [path.resolve(__dirname, '../../../devextreme-scss/scss/widgets/material/_index.scss')]: '// public widgets\n@use "./toolbar";@use "./button";@use "./icon";@use "./menu";',
 };
@@ -133,7 +135,7 @@ jest.mock('fs', () => ({
 jest.mock('filing-cabinet', () => ({
   __esModule: true,
   default: (options: cabinet.Options): string => {
-    const normalizedPartial = options.partial.replace('./', '');
+    const normalizedPartial = options.partial.replace(/^\.\//, '');
     return `${normalizedPartial}.${tsFilesSet.has(normalizedPartial) ? 'ts' : 'js'}`;
   },
 }));
@@ -293,3 +295,4 @@ describe('Integration test', () => {
     expect(builtDependenciesCopy).toEqual(idealDependenciesCopy);
   });
 });
+

packages/devextreme/build/gulp/bundler-config.js

@@ -12,12 +12,12 @@ const headerPipes = require('./header-pipes.js');
 const { packageDir } = require('./utils');
 
 const BUNDLE_CONFIG_SOURCES = [
-    'js/bundles/modules/parts/core.js',
-    'js/bundles/modules/parts/data.js',
-    'js/bundles/modules/parts/widgets-base.js',
-    'js/bundles/modules/parts/widgets-web.js',
-    'js/bundles/modules/parts/viz.js',
-    'js/bundles/modules/parts/aspnet.js'
+    'build/bundle-templates/modules/parts/core.js',
+    'build/bundle-templates/modules/parts/data.js',
+    'build/bundle-templates/modules/parts/widgets-base.js',
+    'build/bundle-templates/modules/parts/widgets-web.js',
+    'build/bundle-templates/modules/parts/viz.js',
+    'build/bundle-templates/modules/parts/aspnet.js'
 ];
 
 gulp.task('bundler-config', function() {
@@ -30,7 +30,7 @@ gulp.task('bundler-config', function() {
         .pipe(replace(/^[ ]{4}/gm, ''))
         .pipe(replace(/^[\n\r]{2,}/gm, '\n\n'))
         .pipe(eol())
-        .pipe(gulp.dest('js/bundles'))
+        .pipe(gulp.dest('build/bundle-templates'))
         .pipe(rename('dx.custom.config.js'))
         .pipe(replace(/require *\( *["']..\//g, 'require(\'devextreme/'))
         .pipe(gulp.dest(`${context.RESULT_NPM_PATH}/${packageDir}/bundles`));

packages/devextreme/build/gulp/transpile.js

@@ -34,7 +34,6 @@ const src = [
 ];
 
 const esmTranspileSrc = src.concat([
-    '!js/bundles/**/*',
     '!js/viz/docs/**/*',
     '!**/*.json'
 ]);
@@ -58,8 +57,6 @@ const generatedTs = [
     'integration/jquery.d.ts'
 ];
 
-const bundlesSrc = ['js/bundles/**/*.js'];
-
 const TS_OUTPUT_BASE_DIR = 'artifacts/dist_ts';
 const TS_OUTPUT_SRC = [`${TS_OUTPUT_BASE_DIR}/__internal/**/*.{js,jsx}`];
 const TS_COMPILER_CONFIG = {
@@ -153,12 +150,20 @@ const transpile = (src, dist, { jsPipes, tsPipes }) => {
 const cachedJsBabelCjs = () =>
     cache(babel(transpileConfig.cjs), { name: 'babel-cjs' });
 
+const bundlesSrc = 'build/bundle-templates/**/*.js';
 
-const transpileDefault = () => transpile(src, ctx.TRANSPILED_PATH, {
-    jsPipes: [ cachedJsBabelCjs() ],
-    tsPipes: [ babel(transpileConfig.tsCjs) ],
+const transpileBundles = (dist) => transpile(bundlesSrc, path.join(dist, './bundles'), {
+    jsPipes: [ removeDebug(), cachedJsBabelCjs() ],
 });
 
+const transpileDefault = () => gulp.series(
+    transpile(src, ctx.TRANSPILED_PATH, {
+        jsPipes: [ cachedJsBabelCjs() ],
+        tsPipes: [ babel(transpileConfig.tsCjs) ],
+    }),
+    transpileBundles(ctx.TRANSPILED_PATH),
+);
+
 const transpileProd = (dist, isEsm) => transpile(
     src,
     dist,
@@ -174,14 +179,15 @@ const transpileProd = (dist, isEsm) => transpile(
     },
 );
 
-const transpileRenovationProd = (watch) => transpileProd(ctx.TRANSPILED_PROD_RENOVATION_PATH, false, watch);
+const transpileRenovationProd = (watch) => gulp.series(
+    transpileProd(ctx.TRANSPILED_PROD_RENOVATION_PATH, false, watch),
+    transpileBundles(ctx.TRANSPILED_PROD_RENOVATION_PATH),
+);
 
 const transpileEsm = (dist) => gulp.series.apply(gulp, [
     transpileProd(path.join(dist, './cjs'), false),
     transpileProd(path.join(dist, './esm'), true),
-    transpile(bundlesSrc, path.join(dist, './bundles'), {
-        jsPipes: [ removeDebug(), cachedJsBabelCjs() ],
-    }),
+    transpileBundles(dist),
     () => gulp
         .src(esmTranspileSrc)
         .pipe(flatMap((stream, file) => {