devextreme-cli 1.10.1 → 1.11.0-beta.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "devextreme-cli",
-  "version": "1.10.1",
+  "version": "1.11.0-beta.0",
   "description": "DevExtreme CLI",
   "keywords": [
     "devexpress",
@@ -43,7 +43,7 @@
     "minimist": "^1.2.8",
     "mustache": "^3.2.1",
     "prompts": "^2.4.2",
-    "sass": "^1.86.3",
+    "sass": "^1.85.1",
     "semver": "^5.7.2",
     "strip-bom": "^4.0.0"
   },
@@ -51,6 +51,7 @@
     "@typescript-eslint/eslint-plugin": "^4.33.0",
     "@typescript-eslint/parser": "^4.33.0",
     "babel-eslint": "^10.1.0",
+    "create-vite": "6.3.1",
     "cross-env": "^5.2.1",
     "eslint": "^7.32.0",
     "eslint-config-angular": "^0.5.0",
@@ -58,7 +59,7 @@
     "eslint-plugin-angular": "^4.1.0",
     "eslint-plugin-jest": "^22.21.0",
     "eslint-plugin-prettier": "^4.2.1",
-    "eslint-plugin-react": "^7.37.5",
+    "eslint-plugin-react": "^7.37.4",
     "eslint-plugin-react-hooks": "^4.6.2",
     "eslint-plugin-unused-imports": "^1.1.5",
     "eslint-plugin-vue": "^7.20.0",
@@ -70,7 +71,8 @@
     "tree-kill": "^1.2.2",
     "tree-kill-promise": "^1.0.12",
     "typescript": "^4.0.2",
-    "typescript-eslint-parser": "^22.0.0"
+    "typescript-eslint-parser": "^22.0.0",
+    "wait-on": "8.0.0"
   },
-  "gitHead": "c8a1d6b0ae5e608f67ed1fbbd1fba3427f3cbfcf"
+  "gitHead": "12a211ead8510e78eb1f33b6a34664823d73a4a7"
 }

package/src/application.js

@@ -1,12 +1,34 @@
 const angularApplication = require('./applications/application.angular');
 const reactApplication = require('./applications/application.react');
+const nextjsApplication = require('./applications/application.nextjs');
 const vueApplication = require('./applications/application.vue');
+const getReactAppType = require('./utility/prompts/react-app-type');
 const printHelp = require('./help').printHelp;
 
 const isApplicationCommand = (command) => {
     return [ 'new', 'add' ].includes(command);
 };
 
+const handleWrongAppType = (appType, command) => {
+    console.error(`The '${appType}' application type is not valid`);
+    printHelp(command);
+};
+
+const createReact = async(appName, options, command) => {
+    const reactAppType = await getReactAppType(options['app-type']);
+
+    switch(reactAppType) {
+        case 'vite':
+            await reactApplication.create(appName, options);
+            return;
+        case 'nextjs':
+            await nextjsApplication.create(appName, options);
+            return;
+        default:
+            handleWrongAppType(reactAppType, command);
+    }
+};
+
 const run = async(commands, options, devextremeConfig) => {
     if(!commands[1]) {
         console.error('Command is incomplete. Please specify parameters.');
@@ -23,15 +45,15 @@ const run = async(commands, options, devextremeConfig) => {
                 await angularApplication.create(appName, options);
                 return;
             case 'react-app':
-                await reactApplication.create(appName, options);
+                await createReact(appName, options, commands[0]);
                 return;
             case 'vue-app':
                 await vueApplication.create(appName, options);
                 return;
             default:
-                console.error(`The '${app}' application type is not valid`);
-                printHelp(commands[0]);
+                handleWrongAppType(app, commands[0]);
         }
+
     } else {
         if(commands[0] === 'add') {
             if(commands[1] === 'devextreme-angular') {
@@ -40,7 +62,12 @@ const run = async(commands, options, devextremeConfig) => {
             }
 
             if(commands[1] === 'devextreme-react') {
-                reactApplication.install(options);
+                if(nextjsApplication.isNextJsApp()) {
+                    nextjsApplication.install(options);
+                } else {
+                    reactApplication.install(options);
+                }
+
                 return;
             }
 
@@ -54,23 +81,16 @@ const run = async(commands, options, devextremeConfig) => {
                 return;
             }
 
-            if(devextremeConfig.applicationEngine === 'angular') {
-                if(commands[1] === 'view') {
-                    angularApplication.addView(commands[2], options);
-                } else {
-                    console.error('Invalid command');
-                    printHelp(commands[0]);
-                }
-            } else if(devextremeConfig.applicationEngine === 'react') {
-                if(commands[1] === 'view') {
-                    reactApplication.addView(commands[2], options);
-                } else {
-                    console.error('Invalid command');
-                    printHelp(commands[0]);
-                }
-            } else if(devextremeConfig.applicationEngine === 'vue') {
+            const app = {
+                'angular': angularApplication,
+                'react': reactApplication,
+                'nextjs': nextjsApplication,
+                'vue': vueApplication,
+            }[devextremeConfig.applicationEngine];
+
+            if(app) {
                 if(commands[1] === 'view') {
-                    vueApplication.addView(commands[2], options);
+                    app.addView(commands[2], options);
                 } else {
                     console.error('Invalid command');
                     printHelp(commands[0]);

package/src/applications/application.angular.js

@@ -7,10 +7,13 @@ const fs = require('fs');
 const dasherize = require('../utility/string').dasherize;
 const ngVersion = require('../utility/ng-version');
 const latestVersions = require('../utility/latest-versions');
-const { extractToolingVersion, toolingVersionOptionName } = require('../utility/extract-tooling-version');
+const { extractDepsVersionTag, depsVersionTagOptionName } = require('../utility/extract-deps-version-tag');
+const { getPackageJsonPath } = require('../utility/package-json-utils');
+const modifyJson = require('../utility/modify-json-file');
 const schematicsVersion = latestVersions['devextreme-schematics'] || 'latest';
 
 const minNgCliVersion = new semver('17.0.0');
+const ngCliWithZoneless = new semver('20.0.0');
 
 async function runSchematicCommand(schematicCommand, options, evaluatingOptions) {
     const collectionName = 'devextreme-schematics';
@@ -27,7 +30,7 @@ async function runSchematicCommand(schematicCommand, options, evaluatingOptions)
 
     const commandArguments = ['g', `${collectionName}:${schematicCommand}`];
 
-    const { [toolingVersionOptionName]: _, ...optionsToArguments } = options; // eslint-disable-line no-unused-vars
+    const { [depsVersionTagOptionName]: _, ...optionsToArguments } = options; // eslint-disable-line no-unused-vars
     for(let option in optionsToArguments) {
         commandArguments.push(`--${dasherize(option)}=${options[option]}`);
     }
@@ -37,12 +40,13 @@ async function runSchematicCommand(schematicCommand, options, evaluatingOptions)
 
 async function runNgCommand(commandArguments, commandOptions, commandConfig) {
     const hasNg = await hasSutableNgCli();
-    const toolingVersion = extractToolingVersion(commandOptions);
-    const npmCommandName = hasNg && !toolingVersion ? 'ng' : 'npx';
+    const depsVersionTag = extractDepsVersionTag(commandOptions);
+    const npmCommandName = hasNg && !depsVersionTag ? 'ng' : 'npx';
     const [minCliLtsVersion] = minNgCliVersion.version.split('.');
-    const ngCommandArguments = hasNg && !toolingVersion
+
+    const ngCommandArguments = hasNg && !depsVersionTag
         ? []
-        : ['-p', `@angular/cli@v${minCliLtsVersion}-lts`, 'ng'];
+        : ['-p', `@angular/cli@${depsVersionTag || `v${minCliLtsVersion}-lts`}`, 'ng'];
 
     ngCommandArguments.push(...commandArguments);
     return runCommand(npmCommandName, ngCommandArguments, commandConfig);
@@ -60,6 +64,7 @@ function localPackageExists(packageName) {
 
 const hasSutableNgCli = async() => {
     const localVersion = ngVersion.getLocalNgVersion();
+
     if(!localVersion) {
         return false;
     }
@@ -74,8 +79,28 @@ const install = async(options) => {
     });
 };
 
+const bumpAngular = (appPath, versionTag) => {
+    modifyJson(getPackageJsonPath(appPath), ({ dependencies, devDependencies, ...rest }) => {
+        const bump = (section) => {
+            for(const depName in section) {
+                section[depName] = depName.startsWith('@angular') ? versionTag : section[depName];
+            }
+            return section;
+        };
+
+        return {
+            dependencies: bump(dependencies),
+            devDependencies: bump(devDependencies),
+            ...rest,
+        };
+    });
+
+};
+
 const create = async(appName, options) => {
     const layout = await getLayoutInfo(options.layout);
+    const depsVersionTag = extractDepsVersionTag(options);
+    const currentNgVersion = ngVersion.getNgCliVersion().version;
 
     const commandArguments = [
         'new',
@@ -84,14 +109,22 @@ const create = async(appName, options) => {
         '--routing=false',
         '--skip-tests=true',
         '--skip-install=true',
-        '--standalone=false',
+        '--standalone=true',
         '--ssr=false'
     ];
 
+    if(ngCliWithZoneless.compare(currentNgVersion) <= 0) {
+        commandArguments.push('--zoneless=false');
+    }
+
     await runNgCommand(commandArguments, options);
 
     const appPath = path.join(process.cwd(), appName);
 
+    if(depsVersionTag) {
+        bumpAngular(appPath, depsVersionTag);
+    }
+
     options.resolveConflicts = 'override';
     options.updateBudgets = true;
     options.layout = layout;
@@ -125,9 +158,9 @@ const changeMainTs = (appPath) => {
     moduleWorker.insertImport(filePath, 'devextreme/ui/themes', 'themes', true);
 
     const fileContent = fs.readFileSync(filePath).toString();
-    const bootstrapPattern = /platformBrowser(?:Dynamic)?\(\)\.bootstrapModule\(\s*AppModule\s*(?:,\s*\{[^}]*\})?\s*\)/;
+    const bootstrapPattern = /bootstrapApplication\([^)]+\)/;
     const firstChaptStr = fileContent.match(bootstrapPattern)[0];
-    const lastChaptStr = '.catch(err => console.error(err));';
+    const lastChaptStr = '.catch((err) => console.error(err));';
 
     fs.writeFileSync(
         filePath,

package/src/applications/application.nextjs.js

@@ -0,0 +1,231 @@
+const runCommand = require('../utility/run-command');
+const path = require('path');
+const fs = require('fs');
+const getLayoutInfo = require('../utility/prompts/layout');
+const getTemplateTypeInfo = require('../utility/prompts/typescript');
+const templateCreator = require('../utility/template-creator');
+const packageManager = require('../utility/package-manager');
+const packageJsonUtils = require('../utility/package-json-utils');
+const insertItemToArray = require('../utility/file-content').insertItemToArray;
+const stringUtils = require('../utility/string');
+const typescriptUtils = require('../utility/typescript-extension');
+const removeFile = require('../utility/file-operations').remove;
+const latestVersions = require('../utility/latest-versions');
+const { extractDepsVersionTag } = require('../utility/extract-deps-version-tag');
+const {
+    updateJsonPropName,
+    bumpReact,
+    getCorrectPath,
+    addStylesToApp,
+    getComponentPageName,
+} = require('./application.react');
+
+const defaultStyles = [
+    'devextreme/dist/css/dx.light.css'
+];
+
+const isNextJsApp = () => {
+    const appPath = process.cwd();
+
+    return fs.existsSync(path.join(appPath, 'next.config.ts')) || fs.existsSync(path.join(appPath, 'next.config.mjs'));
+};
+
+const isTsApp = (appPath) => {
+    return fs.existsSync(path.join(appPath, 'next.config.ts'));
+};
+
+const getExtension = (appPath) => {
+    return fs.existsSync(path.join(appPath, 'src/app', 'layout.tsx')) ? '.tsx' : '.jsx';
+};
+
+const pathToPagesIndex = () => {
+    const extension = getExtension(process.cwd());
+    return path.join(process.cwd(), 'src', 'views', `index${extension}`);
+};
+
+const preparePackageJsonForTemplate = (appPath, appName) => {
+    const dependencies = [
+        { name: 'devextreme-cli', version: latestVersions['devextreme-cli'], dev: true },
+        { name: 'jose', version: latestVersions['jose'] },
+    ];
+    const scripts = [
+        { name: 'build-themes', value: 'devextreme build' },
+        { name: 'postinstall', value: 'npm run build-themes' }
+    ];
+
+    packageJsonUtils.addDependencies(appPath, dependencies);
+    packageJsonUtils.updateScripts(appPath, scripts);
+    packageJsonUtils.updateName(appPath, appName);
+};
+
+const create = async(appName, options) => {
+    const templateType = await getTemplateTypeInfo(options.template);
+    const layoutType = await getLayoutInfo(options.layout);
+
+    const templateOptions = Object.assign({}, options, {
+        project: stringUtils.humanize(appName),
+        layout: stringUtils.classify(layoutType),
+        isTypeScript: typescriptUtils.isTypeScript(templateType)
+    });
+    const depsVersionTag = extractDepsVersionTag(options);
+
+    let commandArguments = [`-p=create-next-app@${depsVersionTag || latestVersions['create-next-app']}`, 'create-next-app', appName];
+
+    commandArguments = [
+        ...commandArguments,
+        `${templateOptions.isTypeScript ? '--typescript' : '--javascript'}`,
+        '--eslint',
+        '--no-tailwind',
+        '--src-dir',
+        '--app',
+        '--no-turbopack',
+        '--import-alias "@/*"',
+    ];
+
+    await runCommand('npx', commandArguments);
+
+    const appPath = path.join(process.cwd(), appName);
+
+    if(depsVersionTag) {
+        bumpReact(appPath, depsVersionTag, templateOptions.isTypeScript);
+    }
+
+    addTemplate(appPath, appName, templateOptions);
+    modifyAppFiles(appPath, templateOptions);
+};
+
+const modifyAppFiles = (appPath, { project, isTypeScript }) => {
+    const entryFilePath = path.join(appPath, `src/app/layout.${isTypeScript ? 'tsx' : 'jsx'}`);
+
+    let content = fs.readFileSync(entryFilePath).toString();
+    content = content.replace(/<title>[^<]+<\/title>/, `<title>${project}<\/title>`);
+
+    fs.writeFileSync(entryFilePath, content);
+};
+
+const addTemplate = (appPath, appName, templateOptions) => {
+    const applicationTemplatePath = path.join(
+        templateCreator.getTempaltePath('nextjs'),
+        'application'
+    );
+
+    const manifestPath = path.join(appPath, 'public', 'manifest.json');
+
+    const styles = [
+        '../dx-styles.scss',
+        '../themes/generated/theme.additional.css',
+        '../themes/generated/theme.additional.dark.css',
+        '../themes/generated/theme.base.css',
+        '../themes/generated/theme.base.dark.css',
+        'devextreme/dist/css/dx.common.css'
+    ];
+
+    templateCreator.moveTemplateFilesToProject(applicationTemplatePath, appPath, templateOptions, getCorrectPath);
+
+    !templateOptions.isTypeScript && removeFile(path.join(appPath, 'src', 'types.jsx'));
+    removeFile(path.join(appPath, 'src/app', 'page.js'));
+    removeFile(path.join(appPath, 'src/app', 'layout.js'));
+    removeFile(path.join(appPath, 'src/app', 'globals.scss'));
+
+    if(!templateOptions.empty) {
+        addSamplePages(appPath, templateOptions);
+    }
+
+    preparePackageJsonForTemplate(appPath, appName, templateOptions.isTypeScript);
+    updateJsonPropName(manifestPath, appName);
+    install({ isTypeScript: templateOptions.isTypeScript }, appPath, styles);
+};
+
+const getEntryFilePath = (options, appPath) => {
+    const extension = options.isTypeScript || isTsApp(appPath) ? 'ts' : 'js';
+    const srcFolder = fs.existsSync(path.join(appPath, 'src')) ? 'src' : '';
+    const isAppRouterApp = fs.existsSync(path.join(appPath, srcFolder, 'app')) && fs.lstatSync(appPath).isDirectory();
+
+    const entryFilePath = isAppRouterApp
+        ? path.join('app', `layout.${extension}`)
+        : path.join('pages', `_app.${extension}`);
+
+    const jsx = fs.existsSync(path.join(appPath, srcFolder, entryFilePath + 'x')) ? 'x' : '';
+
+    return path.join(srcFolder, entryFilePath + jsx);
+};
+
+const install = (options, appPath, styles) => {
+    appPath = appPath ? appPath : process.cwd();
+
+    const pathToMainComponent = path.join(appPath, getEntryFilePath(options, appPath));
+
+    addStylesToApp(pathToMainComponent, styles || defaultStyles);
+    packageJsonUtils.addDevextreme(appPath, options.dxversion, 'react');
+
+    packageManager.runInstall({ cwd: appPath });
+};
+
+const getNavigationData = (viewName, componentName, icon) => {
+    const pagePath = stringUtils.dasherize(viewName);
+    return {
+        navigation: `\n  {\n    text: \'${stringUtils.humanize(viewName)}\',\n    path: \'/pages/${pagePath}\',\n    icon: \'${icon}\'\n  }`
+    };
+};
+
+const createPathToPage = (pageName) => {
+    const pagesPath = path.join(process.cwd(), 'src', 'app/pages');
+    const newPageFolderPath = path.join(pagesPath, pageName);
+
+    if(!fs.existsSync(pagesPath)) {
+        fs.mkdirSync(pagesPath);
+        fs.writeFileSync(pathToPagesIndex(), '');
+    }
+
+    if(!fs.existsSync(newPageFolderPath)) {
+        fs.mkdirSync(newPageFolderPath);
+    }
+
+    return newPageFolderPath;
+};
+
+const addSamplePages = (appPath, templateOptions) => {
+    const samplePageTemplatePath = path.join(
+        templateCreator.getTempaltePath('nextjs'),
+        'sample-pages'
+    );
+
+    const pagesPath = path.join(appPath, 'src', 'app/pages');
+
+    templateCreator.moveTemplateFilesToProject(samplePageTemplatePath, pagesPath, {
+        isTypeScript: templateOptions.isTypeScript
+    }, getCorrectPath);
+};
+
+const addView = (pageName, options) => {
+    const pageTemplatePath = path.join(
+        templateCreator.getTempaltePath('nextjs'),
+        'page'
+    );
+    const extension = getExtension(process.cwd());
+
+    const componentName = getComponentPageName(pageName);
+    const pathToPage = createPathToPage(pageName);
+    const navigationModulePath = path.join(process.cwd(), 'src', `app-navigation${extension}`);
+    const navigationData = getNavigationData(pageName, componentName, options && options.icon || 'folder');
+
+    const getCorrectExtension = (fileExtension) => {
+        return fileExtension === '.tsx' ? extension : fileExtension;
+    };
+
+    const getPageFileName = (pageName, pageItem) => {
+        return pageItem === 'page.tsx' ? 'page' : pageName;
+    };
+
+    templateCreator.addPageToApp(pageName, pathToPage, pageTemplatePath, getCorrectExtension, { getPageFileName });
+
+    insertItemToArray(navigationModulePath, navigationData.navigation);
+};
+
+module.exports = {
+    isNextJsApp,
+    install,
+    create,
+    addTemplate,
+    addView
+};

package/src/applications/application.react.js

@@ -3,6 +3,7 @@ const path = require('path');
 const fs = require('fs');
 const getLayoutInfo = require('../utility/prompts/layout');
 const getTemplateTypeInfo = require('../utility/prompts/typescript');
+const getTranspilerTypeInfo = require('../utility/prompts/transpiler');
 const templateCreator = require('../utility/template-creator');
 const packageManager = require('../utility/package-manager');
 const packageJsonUtils = require('../utility/package-json-utils');
@@ -13,13 +14,13 @@ const stringUtils = require('../utility/string');
 const typescriptUtils = require('../utility/typescript-extension');
 const removeFile = require('../utility/file-operations').remove;
 const latestVersions = require('../utility/latest-versions');
-const { extractToolingVersion } = require('../utility/extract-tooling-version');
+const { extractDepsVersionTag } = require('../utility/extract-deps-version-tag');
 const defaultStyles = [
     'devextreme/dist/css/dx.light.css'
 ];
 
 const getExtension = (appPath) => {
-    return fs.existsSync(path.join(appPath, 'src', 'App.tsx')) ? '.tsx' : '.js';
+    return fs.existsSync(path.join(appPath, 'src', 'App.tsx')) ? '.tsx' : '.jsx';
 };
 
 const pathToPagesIndex = () => {
@@ -27,9 +28,9 @@ const pathToPagesIndex = () => {
     return path.join(process.cwd(), 'src', 'pages', `index${extension}`);
 };
 
-const preparePackageJsonForTemplate = (appPath, appName, isTypeScript) => {
+const preparePackageJsonForTemplate = (appPath, appName) => {
     const dependencies = [
-        { name: 'sass', version: '^1.34.1' },
+        { name: 'sass-embedded', version: '^1.85.1' },
         { name: 'devextreme-cli', version: latestVersions['devextreme-cli'], dev: true },
         { name: 'react-router-dom', version: '^6.3.0' },
     ];
@@ -51,8 +52,25 @@ const updateJsonPropName = (path, name) => {
     });
 };
 
+const bumpReact = (appPath, versionTag, isTypeScript) => {
+    const dependencies = [
+        { name: 'react', version: versionTag },
+        { name: 'react-dom', version: versionTag },
+    ];
+
+    if(isTypeScript) {
+        dependencies.push(
+            { name: '@types/react', version: versionTag, dev: true },
+            { name: '@types/react-dom', version: versionTag, dev: true },
+        );
+    }
+
+    packageJsonUtils.addDependencies(appPath, dependencies);
+};
+
 const create = async(appName, options) => {
     const templateType = await getTemplateTypeInfo(options.template);
+    const transpiler = await getTranspilerTypeInfo(options.transpiler);
     const layoutType = await getLayoutInfo(options.layout);
 
     const templateOptions = Object.assign({}, options, {
@@ -60,27 +78,30 @@ const create = async(appName, options) => {
         layout: stringUtils.classify(layoutType),
         isTypeScript: typescriptUtils.isTypeScript(templateType)
     });
-    const toolingVersion = extractToolingVersion(options);
-    const commandArguments = [`-p=create-react-app${toolingVersion}`, 'create-react-app', appName];
+    const depsVersionTag = extractDepsVersionTag(options);
 
-    const templateSuffix = templateOptions.isTypeScript ? '-typescript' : '';
-    const templatePath = path.resolve(__dirname, `../templates/cra-template${templateSuffix}`);
+    const commandArguments = [`-p=create-vite@${depsVersionTag || latestVersions['create-vite']}`, 'create-vite', appName];
 
-    commandArguments.push(`--template file:${templatePath}`);
+    commandArguments.push(`--template react${transpiler === 'swc' ? '-swc' : ''}${templateOptions.isTypeScript ? '-ts' : ''}`);
 
     await runCommand('npx', commandArguments);
 
     const appPath = path.join(process.cwd(), appName);
 
     modifyIndexHtml(appPath, templateOptions.project);
+
+    if(depsVersionTag) {
+        bumpReact(appPath, depsVersionTag, templateOptions.isTypeScript);
+    }
+
     addTemplate(appPath, appName, templateOptions);
 };
 
 const modifyIndexHtml = (appPath, appName) => {
-    const indexHtmlPath = path.join(appPath, 'public', 'index.html');
+    const indexHtmlPath = path.join(appPath, 'index.html');
 
     let htmlContent = fs.readFileSync(indexHtmlPath).toString();
-    htmlContent = htmlContent.replace(/<title>(\w+\s*)+<\/title>/, `<title>${appName}<\/title>`);
+    htmlContent = htmlContent.replace(/<title>[^<]+<\/title>/, `<title>${appName}<\/title>`);
     htmlContent = htmlContent.replace('<body>', '<body class="dx-viewport">');
 
     fs.writeFileSync(indexHtmlPath, htmlContent);
@@ -97,7 +118,6 @@ const addTemplate = (appPath, appName, templateOptions) => {
     );
 
     const manifestPath = path.join(appPath, 'public', 'manifest.json');
-    const indexPath = path.join(appPath, 'src', templateOptions.isTypeScript ? 'index.tsx' : 'index.js');
 
     const styles = [
         './themes/generated/theme.additional.css',
@@ -108,15 +128,15 @@ const addTemplate = (appPath, appName, templateOptions) => {
     ];
 
     templateCreator.moveTemplateFilesToProject(applicationTemplatePath, appPath, templateOptions, getCorrectPath);
-    removeFile(path.join(appPath, 'src', 'App.css'));
-    !templateOptions.isTypeScript && removeFile(path.join(appPath, 'src', 'types.js'));
+
+    !templateOptions.isTypeScript && removeFile(path.join(appPath, 'src', 'types.jsx'));
+
     if(!templateOptions.empty) {
         addSamplePages(appPath, templateOptions);
     }
 
     preparePackageJsonForTemplate(appPath, appName, templateOptions.isTypeScript);
     updateJsonPropName(manifestPath, appName);
-    addPolyfills(packageJsonUtils.getPackageJsonPath(), indexPath);
     install({}, appPath, styles);
 };
 
@@ -130,15 +150,6 @@ const install = (options, appPath, styles) => {
     packageManager.runInstall({ cwd: appPath });
 };
 
-const addPolyfills = (packagePath, indexPath) => {
-    const packages = [
-        { name: 'react-app-polyfill', version: '^1.0.0' }
-    ];
-
-    packageJsonUtils.addDependencies(packagePath, packages);
-    moduleUtils.insertImport(indexPath, './polyfills');
-};
-
 const addStylesToApp = (filePath, styles) => {
     styles.forEach(style => {
         moduleUtils.insertImport(filePath, style);
@@ -213,5 +224,10 @@ module.exports = {
     install,
     create,
     addTemplate,
-    addView
+    addView,
+    updateJsonPropName,
+    bumpReact,
+    getCorrectPath,
+    addStylesToApp,
+    getComponentPageName,
 };