refactor(tools): remove js template from @ui5/create-webcomponents-package

packages/create-package/README.md

@@ -21,7 +21,6 @@ Options:
     --name <string>     - defines the package name
     --component-name <string>      - defines the component class name that will be created in your new package
     --tag <string>      - defines the tag name of the sample web component that will be created in your new package. The tag will be derived from the component name if not provided.
-    --enable-typescript - enables TypeScript support for the package
     --skip              - skips configuration and generates package with a default value for each parameter that wasn't passed
 ```
 
@@ -37,7 +36,6 @@ Options:
     --name <string>     - defines the package name
     --component-name <string>      - defines the component class name that will be created in your new package
     --tag <string>      - defines the tag name of the sample web component that will be created in your new package
-    --enable-typescript - enables TypeScript support for the package
     --skip              - skips configuration and generates package with a default value for each parameter that wasn't passed
 ```
 

packages/create-package/create-package.js

@@ -15,13 +15,6 @@ const version = JSON.parse(fs.readFileSync(path.join(__dirname, "package.json"))
 // from where all the files will be copied
 const TEMPLATE_DIR = path.join(`${__dirname}`, `template/`);
 
-// String utils
-const isTSRelatedFile = sourcePath => {
-	return ["Assets.ts", "MyFirstComponent.ts", "tsconfig.json", "global.d.ts"].some(fileName => sourcePath.includes(fileName));
-};
-const isJSRelatedFile = sourcePath => {
-	return ["Assets.js", "MyFirstComponent.js"].some(fileName => sourcePath.includes(fileName));
-};
 const isGitIgnore = sourcePath => {
 	return sourcePath.includes("gitignore");
 };
@@ -65,13 +58,6 @@ const replaceVarsInFileName = (vars, fileName) => {
 };
 
 const copyFile = (vars, sourcePath, destPath) => {
-	const ignoreJsRelated = vars.INIT_PACKAGE_VAR_TYPESCRIPT && isJSRelatedFile(sourcePath);
-	const ignoreTsRelated = !vars.INIT_PACKAGE_VAR_TYPESCRIPT && isTSRelatedFile(sourcePath);
-
-	if (ignoreJsRelated || ignoreTsRelated) {
-		return;
-	}
-
 	if (isLogo(sourcePath)) {
 		fs.copyFileSync(sourcePath, destPath);
 		return;
@@ -108,7 +94,7 @@ const copyFiles = (vars, sourcePath, destPath) => {
 	}
 };
 
-const generateFilesContent = (packageName, componentName, namespace, typescript, skipSubfolder) => {
+const generateFilesContent = (packageName, componentName, namespace, skipSubfolder) => {
 	const tagName = argv.tag || hyphaneteComponentName(componentName);
 
 	// All variables that will be replaced in the content of the resources/
@@ -117,7 +103,6 @@ const generateFilesContent = (packageName, componentName, namespace, typescript,
 		INIT_PACKAGE_VAR_NAME: packageName,
 		INIT_PACKAGE_VAR_TAG: tagName,
 		INIT_PACKAGE_VAR_CLASS_NAME: componentName,
-		INIT_PACKAGE_VAR_TYPESCRIPT: typescript,
 	};
 
 	const packageContent = {
@@ -150,13 +135,10 @@ const generateFilesContent = (packageName, componentName, namespace, typescript,
 		"devDependencies": {
 			"@ui5/webcomponents-tools": version,
 			"chromedriver": "*",
+			"typescript": "^5.2.2"
 		},
 	};
 
-	if (typescript) {
-		packageContent.devDependencies.typescript = "^4.9.4";
-	}
-
 	// Update package.json
 	let destDir = packageName.includes("@") ? packageName.slice(packageName.lastIndexOf("/") + 1) : packageName;
 
@@ -207,11 +189,10 @@ const createWebcomponentsPackage = async () => {
 	let packageName = argv.name || "my-package";
 	let componentName = argv.componentName || "MyComponent";
 	let namespace = argv.namespace || "demo.components";
-	let typescriptSupport = !!argv.enableTypescript;
 	const skipSubfolder = !!argv.skipSubfolder;
 
 	if (argv.skip) {
-		return generateFilesContent(packageName, componentName, namespace, typescriptSupport, skipSubfolder);
+		return generateFilesContent(packageName, componentName, namespace, skipSubfolder);
 	}
 
 	if (!argv.name) {
@@ -224,25 +205,6 @@ const createWebcomponentsPackage = async () => {
 		packageName = response.name;
 	}
 
-	if (!typescriptSupport) {
-		response = await prompts({
-			type: "select",
-			name: "language",
-			message: "Project type:",
-			choices: [
-				{
-					title: "JavaScript",
-					value: false,
-				},
-				{
-					title: "TypeScript",
-					value: true,
-				},
-			],
-		});
-		typescriptSupport = response.language;
-	}
-
 	if (!argv.componentName) {
 		response = await prompts({
 			type: "text",
@@ -265,7 +227,7 @@ const createWebcomponentsPackage = async () => {
 		namespace = response.namespace;
 	}
 
-	return generateFilesContent(packageName, componentName, namespace, typescriptSupport, skipSubfolder);
+	return generateFilesContent(packageName, componentName, namespace, skipSubfolder);
 };
 
 createWebcomponentsPackage();

packages/create-package/template/package-scripts.js

@@ -2,7 +2,7 @@ const getScripts = require("@ui5/webcomponents-tools/components-package/nps.js")
 
 const options = {
 	port: 8080,
-	typescript: INIT_PACKAGE_VAR_TYPESCRIPT,
+	typescript: true,
 };
 
 const scripts = getScripts(options);

packages/tools/lib/create-new-component/index.js

@@ -58,21 +58,15 @@ const getLibraryName = packageName => {
 	return packageName.substr("webcomponents-".length);
 };
 
-const generateFiles = (componentName, tagName, library, packageName, isTypeScript) => {
+const generateFiles = (componentName, tagName, library, packageName) => {
 	componentName = capitalizeFirstLetter(componentName);
 	const filePaths = {
-		"main": isTypeScript 
-			? `./src/${componentName}.ts` 
-			: `./src/${componentName}.js`,
+		"main": `./src/${componentName}.ts`,
 		"css": `./src/themes/${componentName}.css`,
 		"template": `./src/${componentName}.hbs`,
 	};
 
-	const FileContentTemplate = isTypeScript 
-		? tsFileContentTemplate(componentName, tagName, library, packageName) 
-		: jsFileContentTemplate(componentName, tagName, library, packageName);
-
-	fs.writeFileSync(filePaths.main, FileContentTemplate, { flag: "wx+" });
+	fs.writeFileSync(filePaths.main, tsFileContentTemplate(componentName, tagName, library, packageName), { flag: "wx+" });
 	fs.writeFileSync(filePaths.css, "", { flag: "wx+" });
 	fs.writeFileSync(filePaths.template, "<div>Hello World</div>", { flag: "wx+" });
 
@@ -112,10 +106,9 @@ const createWebComponent = async () => {
 		}
 	}
 
-	const isTypeScript = fs.existsSync(path.join(process.cwd(), "tsconfig.json"));
 	const tagName = hyphaneteComponentName(componentName);
 
-	generateFiles(componentName, tagName, library, packageName, isTypeScript);
+	generateFiles(componentName, tagName, library, packageName);
 };
 
 createWebComponent();