Skip to content

Commit cf234b4

Browse files
GoodDayForSurfVasilyStrelyaev
GoodDayForSurf
and
VasilyStrelyaev
authored
Move to create vite for creating React app (#928)
* replace create-react-app by create-vite for creating React App template --------- Co-authored-by: Vasily Strelyaev <Vasily.Strelyaev@devexpress.com>
1 parent b2faf11 commit cf234b4

File tree

224 files changed

+108
-1090
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

224 files changed

+108
-1090
lines changed

‎package-lock.json‎

Lines changed: 2 additions & 297 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎packages/devextreme-cli/package-lock.json‎

Lines changed: 28 additions & 10 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎packages/devextreme-cli/package.json‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -52,6 +52,7 @@
5252
"@typescript-eslint/parser": "^4.33.0",
5353
"babel-eslint": "^10.1.0",
5454
"cross-env": "^5.2.1",
55+
"create-vite": "6.3.1",
5556
"eslint": "^7.32.0",
5657
"eslint-config-angular": "^0.5.0",
5758
"eslint-config-prettier": "^8.10.0",

‎packages/devextreme-cli/src/applications/application.react.js‎

Lines changed: 11 additions & 24 deletions
Original file line numberDiff line numberDiff line change
@@ -13,23 +13,22 @@ const stringUtils = require('../utility/string');
1313
const typescriptUtils = require('../utility/typescript-extension');
1414
const removeFile = require('../utility/file-operations').remove;
1515
const latestVersions = require('../utility/latest-versions');
16-
const { extractToolingVersion } = require('../utility/extract-tooling-version');
1716
const defaultStyles = [
1817
'devextreme/dist/css/dx.light.css'
1918
];
2019

2120
const getExtension = (appPath) => {
22-
return fs.existsSync(path.join(appPath, 'src', 'App.tsx')) ? '.tsx' : '.js';
21+
return fs.existsSync(path.join(appPath, 'src', 'App.tsx')) ? '.tsx' : '.jsx';
2322
};
2423

2524
const pathToPagesIndex = () => {
2625
const extension = getExtension(process.cwd());
2726
return path.join(process.cwd(), 'src', 'pages', `index${extension}`);
2827
};
2928

30-
const preparePackageJsonForTemplate = (appPath, appName, isTypeScript) => {
29+
const preparePackageJsonForTemplate = (appPath, appName) => {
3130
const dependencies = [
32-
{ name: 'sass', version: '^1.34.1' },
31+
{ name: 'sass-embedded', version: '^1.85.1' },
3332
{ name: 'devextreme-cli', version: latestVersions['devextreme-cli'], dev: true },
3433
{ name: 'react-router-dom', version: '^6.3.0' },
3534
];
@@ -60,27 +59,25 @@ const create = async(appName, options) => {
6059
layout: stringUtils.classify(layoutType),
6160
isTypeScript: typescriptUtils.isTypeScript(templateType)
6261
});
63-
const toolingVersion = extractToolingVersion(options);
64-
const commandArguments = [`-p=create-react-app${toolingVersion}`, 'create-react-app', appName];
6562

66-
const templateSuffix = templateOptions.isTypeScript ? '-typescript' : '';
67-
const templatePath = path.resolve(__dirname, `../templates/cra-template${templateSuffix}`);
63+
const commandArguments = [`-p=create-vite@${latestVersions['create-vite']}`, 'create-vite', appName];
6864

69-
commandArguments.push(`--template file:${templatePath}`);
65+
commandArguments.push(`--template react${templateOptions.isTypeScript ? '-ts' : ''}`);
7066

7167
await runCommand('npx', commandArguments);
7268

7369
const appPath = path.join(process.cwd(), appName);
7470

7571
modifyIndexHtml(appPath, templateOptions.project);
72+
7673
addTemplate(appPath, appName, templateOptions);
7774
};
7875

7976
const modifyIndexHtml = (appPath, appName) => {
80-
const indexHtmlPath = path.join(appPath, 'public', 'index.html');
77+
const indexHtmlPath = path.join(appPath, 'index.html');
8178

8279
let htmlContent = fs.readFileSync(indexHtmlPath).toString();
83-
htmlContent = htmlContent.replace(/<title>(\w+\s*)+<\/title>/, `<title>${appName}<\/title>`);
80+
htmlContent = htmlContent.replace(/<title>[^<]+<\/title>/, `<title>${appName}<\/title>`);
8481
htmlContent = htmlContent.replace('<body>', '<body class="dx-viewport">');
8582

8683
fs.writeFileSync(indexHtmlPath, htmlContent);
@@ -97,7 +94,6 @@ const addTemplate = (appPath, appName, templateOptions) => {
9794
);
9895

9996
const manifestPath = path.join(appPath, 'public', 'manifest.json');
100-
const indexPath = path.join(appPath, 'src', templateOptions.isTypeScript ? 'index.tsx' : 'index.js');
10197

10298
const styles = [
10399
'./themes/generated/theme.additional.css',
@@ -108,15 +104,15 @@ const addTemplate = (appPath, appName, templateOptions) => {
108104
];
109105

110106
templateCreator.moveTemplateFilesToProject(applicationTemplatePath, appPath, templateOptions, getCorrectPath);
111-
removeFile(path.join(appPath, 'src', 'App.css'));
112-
!templateOptions.isTypeScript && removeFile(path.join(appPath, 'src', 'types.js'));
107+
108+
!templateOptions.isTypeScript && removeFile(path.join(appPath, 'src', 'types.jsx'));
109+
113110
if(!templateOptions.empty) {
114111
addSamplePages(appPath, templateOptions);
115112
}
116113

117114
preparePackageJsonForTemplate(appPath, appName, templateOptions.isTypeScript);
118115
updateJsonPropName(manifestPath, appName);
119-
addPolyfills(packageJsonUtils.getPackageJsonPath(), indexPath);
120116
install({}, appPath, styles);
121117
};
122118

@@ -130,15 +126,6 @@ const install = (options, appPath, styles) => {
130126
packageManager.runInstall({ cwd: appPath });
131127
};
132128

133-
const addPolyfills = (packagePath, indexPath) => {
134-
const packages = [
135-
{ name: 'react-app-polyfill', version: '^1.0.0' }
136-
];
137-
138-
packageJsonUtils.addDependencies(packagePath, packages);
139-
moduleUtils.insertImport(indexPath, './polyfills');
140-
};
141-
142129
const addStylesToApp = (filePath, styles) => {
143130
styles.forEach(style => {
144131
moduleUtils.insertImport(filePath, style);

‎packages/devextreme-cli/src/templates/cra-template-typescript/LICENSE‎

Lines changed: 0 additions & 21 deletions
This file was deleted.

‎packages/devextreme-cli/src/templates/cra-template-typescript/README.md‎

Lines changed: 0 additions & 20 deletions
This file was deleted.

‎packages/devextreme-cli/src/templates/cra-template-typescript/package.json‎

Lines changed: 0 additions & 27 deletions
This file was deleted.

‎packages/devextreme-cli/src/templates/cra-template-typescript/template.json‎

Lines changed: 0 additions & 19 deletions
This file was deleted.

‎packages/devextreme-cli/src/templates/cra-template-typescript/template/README.md‎

Lines changed: 0 additions & 46 deletions
This file was deleted.

‎packages/devextreme-cli/src/templates/cra-template-typescript/template/gitignore‎

Lines changed: 0 additions & 23 deletions
This file was deleted.

0 commit comments

Comments
 (0)