Merge pull request #168 from ckeditor/new-changes-implementation-in-p…

…ackage-generator

Update Package Generator for NIM - updated way of handling the package generation.

.circleci/config.yml

@@ -74,35 +74,35 @@ jobs:
           name: Run unit tests
           command: yarn run coverage
       - run:
-          name: Verify build (JavaScript, npm)
-          command: node scripts/ci/verify-build -l js -p npm
+          name: Verify build (JavaScript, npm, current and legacy installation methods)
+          command: node scripts/ci/verify-build -l js -p npm -m current-and-legacy
       - run:
-          name: Verify build (JavaScript, yarn)
-          command: node scripts/ci/verify-build -l js -p yarn
+          name: Verify build (JavaScript, yarn, current and legacy installation methods)
+          command: node scripts/ci/verify-build -l js -p yarn -m current-and-legacy
       - run:
-          name: Verify build (JavaScript, npm, only new methods)
-          command: node scripts/ci/verify-build -l js -p npm -m
+          name: Verify build (JavaScript, npm, current installation methods)
+          command: node scripts/ci/verify-build -l js -p npm -m current
       - run:
-          name: Verify build (JavaScript, yarn, only new methods)
-          command: node scripts/ci/verify-build -l js -p yarn -m
+          name: Verify build (JavaScript, yarn, current installation methods)
+          command: node scripts/ci/verify-build -l js -p yarn -m current
       - run:
-          name: Verify build (TypeScript, npm, custom plugin name)
-          command: node scripts/ci/verify-build -l ts -p npm -n CustomPluginName
+          name: Verify build (TypeScript, npm, current and legacy installation methods, custom plugin name)
+          command: node scripts/ci/verify-build -l ts -p npm -m current-and-legacy -n CustomPluginName
       - run:
-          name: Verify build (TypeScript, npm, only new methods, custom plugin name)
-          command: node scripts/ci/verify-build -l ts -p npm -m -n CustomPluginName
+          name: Verify build (TypeScript, npm, current installation methods, custom plugin name)
+          command: node scripts/ci/verify-build -l ts -p npm -m current -n CustomPluginName
       - run:
-          name: Verify build (JavaScript, yarn, custom plugin name)
-          command: node scripts/ci/verify-build -l js -p yarn -n customPluginName400
+          name: Verify build (JavaScript, yarn, current and legacy installation methods, custom plugin name)
+          command: node scripts/ci/verify-build -l js -p yarn -m current-and-legacy -n customPluginName400
       - run:
-          name: Verify build (JavaScript, yarn, only new methods, custom plugin name)
-          command: node scripts/ci/verify-build -l js -p yarn -m -n customPluginName400
+          name: Verify build (JavaScript, yarn, current installation methods, custom plugin name)
+          command: node scripts/ci/verify-build -l js -p yarn -m current -n customPluginName400
       - run:
-          name: Verify build (TypeScript, yarn)
-          command: node scripts/ci/verify-build -l ts -p yarn
+          name: Verify build (TypeScript, yarn, current and legacy installation methods)
+          command: node scripts/ci/verify-build -l ts -p yarn -m current-and-legacy
       - run:
-          name: Verify build (TypeScript, yarn, only new methods)
-          command: node scripts/ci/verify-build -l ts -p yarn -m
+          name: Verify build (TypeScript, yarn, current installation methods)
+          command: node scripts/ci/verify-build -l ts -p yarn -m current
       - unless:
           # Upload the code coverage results for non-nightly builds only.
           condition: << pipeline.parameters.isNightly >>

CHANGELOG.md

@@ -13,7 +13,7 @@ Changelog
 
 ### Features
 
-* **[generator](https://www.npmjs.com/package/ckeditor5-package-generator)**: Added the `--use-only-new-installation-methods` CLI flag that should allow the generation of a package without support for the [DLL builds](https://ckeditor.com/docs/ckeditor5/latest/installation/advanced/alternative-setups/dll-builds.html). See [#15502](https://github.com/ckeditor/ckeditor5/issues/15502), [#15739](https://github.com/ckeditor/ckeditor5/issues/15739).
+* **[generator](https://www.npmjs.com/package/ckeditor5-package-generator)**: Added the `--installation-methods` CLI flag that should allow the generation of a package without support for the [DLL builds](https://ckeditor.com/docs/ckeditor5/latest/installation/advanced/alternative-setups/dll-builds.html). See [#15502](https://github.com/ckeditor/ckeditor5/issues/15502), [#15739](https://github.com/ckeditor/ckeditor5/issues/15739).
 * **[tools](https://www.npmjs.com/package/@ckeditor/ckeditor5-package-tools)**: Karma will use the `tsconfig.test.json` file as a TypeScript configuration if it exists when executing automated tests. By default, it fallbacks to `tsconfig.json` file. ([commit](https://github.com/ckeditor/ckeditor5-package-generator/commit/56207d846095a78e35bf2805c2c30823cb6cb9de))
 
 ### Bug fixes

README.md

@@ -70,15 +70,15 @@ The tool will create a new directory called `ckeditor5-package` with an example
 To use a local version of the `@ckeditor/ckeditor5-package-tools` package, use the `--dev` option when executing the command.
 
 ```bash
-node /path/to/repository/packages/ckeditor5-package-generator <packageName> [--dev] [--use-npm] [--use-yarn] [--use-only-new-installation-methods] [--name <...>] [--lang <js|ts>] [--verbose]
+node /path/to/repository/packages/ckeditor5-package-generator <packageName> [--dev] [--use-npm] [--use-yarn] [--installation-methods <current|current-and-legacy>] [--name <...>] [--lang <js|ts>] [--verbose]
 ```
 
 #### Options
 
 * `--dev` &ndash; whether to execute in the development mode. It means that the `@ckeditor/ckeditor5-package-tools` will not be installed from npm, but from the local file system.
 * `--use-npm` &ndash; use `npm` to install dependencies in a newly created package.
 * `--use-yarn` &ndash; use `yarn` to install dependencies in a newly created package.
-* `--use-only-new-installation-methods` &ndash; use only new installation methods in a newly created package.
+* `--installation-methods` &ndash; (values: `current` | `current-and-legacy`) choose which installation methods of CKEditor 5 do you want to support? If omitted, the script will ask the user to choose manually.
 * `--name` &ndash; define a class name to be different from the package name.
 * `--lang` &ndash; (values: `js` | `ts`) choose whether the created package should use JavaScript or TypeScript. If omitted, the script will ask the user to choose manually.
 * `--verbose` &ndash; (alias: `-v`) print additional logs about the current executed task.

package.json

@@ -24,7 +24,7 @@
     "chalk": "^4.1.2",
     "coveralls": "^3.1.1",
     "eslint": "^7.32.0",
-    "eslint-config-ckeditor5": "^5.3.2",
+    "eslint-config-ckeditor5": "^6.0.0",
     "glob": "^10.2.5",
     "husky": "^8.0.2",
     "lint-staged": "^10.5.4",

packages/ckeditor5-package-generator/README.md

@@ -21,7 +21,7 @@ While not necessary, it is also nice to have the latest version of `yarn 1.x` in
 To create a new package without installing the tool, simply execute the following command:
 
 ```bash
-npx ckeditor5-package-generator <packageName> [--use-npm] [--use-yarn] [--use-only-new-installation-methods] [--plugin-name <...>] [--lang <js|ts>] [--verbose]
+npx ckeditor5-package-generator <packageName> [--use-npm] [--use-yarn] [--installation-methods <current|current-and-legacy>] [--plugin-name <...>] [--lang <js|ts>] [--verbose]
 ```
 
 The `<packageName>` argument is required and  must follow these rules:
@@ -41,7 +41,7 @@ As a result of executing the command, a new directory with a package in it will
 
 * `--use-npm` &ndash; use `npm` to install dependencies in a newly created package.
 * `--use-yarn` &ndash; use `yarn` to install dependencies in a newly created package.
-* `--use-only-new-installation-methods` &ndash; use only new installation methods in a newly created package.
+* `--installation-methods` &ndash; (values: `current` | `current-and-legacy`) choose which installation methods of CKEditor 5 do you want to support? If omitted, the script will ask the user to choose manually.
 * `--plugin-name` &ndash; define a class name to be different from the package name.
 * `--lang` &ndash; (values: `js` | `ts`) choose whether the created package should use JavaScript or TypeScript. If omitted, the script will ask the user to choose it manually.
 * `--verbose` &ndash; (alias: `-v`) print additional logs about the current executed task.

packages/ckeditor5-package-generator/bin/index.js

@@ -28,7 +28,7 @@ new Command( packageJson.name )
 	.option( '--use-yarn', 'whether use yarn to install packages', false )
 	.option( '--lang <lang>', 'programming language to use' )
 	.option( '--plugin-name <name>', 'optional custom plugin name' )
-	.option( '--use-only-new-installation-methods', 'without using legacy methods of installations', false )
+	.option( '--installation-methods <method>', 'supported method of installation' )
 	.allowUnknownOption()
 	.version( packageJson.version )
 	.addHelpText( 'after', `\nVersion: ${ packageJson.version }` )

packages/ckeditor5-package-generator/lib/index.js

@@ -9,6 +9,7 @@ const chalk = require( 'chalk' );
 
 const Logger = require( './utils/logger' );
 
+const chooseInstallationMethods = require( './utils/choose-installation-methods' );
 const choosePackageManager = require( './utils/choose-package-manager' );
 const chooseProgrammingLanguage = require( './utils/choose-programming-language' );
 const copyFiles = require( './utils/copy-files' );
@@ -26,7 +27,7 @@ const validatePluginName = require( './utils/validate-plugin-name' );
  * @param {CKeditor5PackageGeneratorOptions} options
  */
 module.exports = async function init( packageName, options ) {
-	const { dev, verbose, useNpm, useYarn, useOnlyNewInstallationMethods, lang, pluginName } = options;
+	const { dev, verbose, useNpm, useYarn, installationMethods, lang, pluginName } = options;
 
 	const logger = new Logger( verbose );
 
@@ -36,6 +37,7 @@ module.exports = async function init( packageName, options ) {
 	const { directoryName, directoryPath } = createDirectory( logger, packageName );
 	const packageManager = await choosePackageManager( useNpm, useYarn );
 	const programmingLanguage = await chooseProgrammingLanguage( logger, lang );
+	const installationMethodOfPackage = await chooseInstallationMethods( logger, installationMethods );
 	const packageVersions = getDependenciesVersions( logger, dev );
 
 	copyFiles( logger, {
@@ -45,7 +47,7 @@ module.exports = async function init( packageName, options ) {
 		packageManager,
 		programmingLanguage,
 		packageVersions,
-		useOnlyNewInstallationMethods
+		installationMethodOfPackage
 	} );
 
 	await installDependencies( directoryPath, packageManager, verbose, dev );
@@ -66,6 +68,30 @@ module.exports = async function init( packageName, options ) {
 		'Example: ' + chalk.gray( packageManager + ' run start' ),
 		''
 	].join( '\n' ), { startWithNewLine: true } );
+
+	if ( installationMethodOfPackage === 'current-and-legacy' ) {
+		logger.info( [
+			chalk.yellow.inverse(
+				' ╔═════════════════════════════════════════════════════════════════════════════════════════════════════════════════════╗ '
+			),
+			chalk.yellow.inverse(
+				' ║   Supporting a wider range of CKEditor 5 versions requires using a more complex method of importing modules         ║ '
+			),
+			chalk.yellow.inverse(
+				' ║   from CKEditor 5.                                                                                                  ║ '
+			),
+			chalk.yellow.inverse(
+				' ║                                                                                                                     ║ '
+			),
+			chalk.yellow.inverse(
+				' ║   Read more here: https://ckeditor.com/docs/ckeditor5/latest/framework/tutorials/supporting-multiple-versions.html  ║ '
+			),
+			chalk.yellow.inverse(
+				' ╚═════════════════════════════════════════════════════════════════════════════════════════════════════════════════════╝ '
+			),
+			''
+		].join( '\n' ), { startWithNewLine: true } );
+	}
 };
 
 /**
@@ -77,7 +103,7 @@ module.exports = async function init( packageName, options ) {
  *
  * @property {Boolean} [useYarn=false]
  *
- * @property {Boolean} [useOnlyNewInstallationMethods=false]
+ * @property {String} installationMethods
  *
  * @property {Boolean} [dev=false]
  *

packages/ckeditor5-package-generator/lib/templates/js-legacy/.eslintrc.cjs

@@ -16,7 +16,17 @@ module.exports = {
 		// Also, importing non-DLL packages is not allowed. If the package requires other features to work, they should be
 		// specified as soft-requirements.
 		// Read more: https://ckeditor.com/docs/ckeditor5/latest/builds/guides/migration/migration-to-26.html#soft-requirements.
-		'ckeditor5-rules/ckeditor-imports': 'error'
+		'ckeditor5-rules/ckeditor-imports': 'error',
+		//  This rule disallows importing from any path other than the package main entrypoint.
+		'ckeditor5-rules/allow-imports-only-from-main-package-entry-point': 'error',
+		// As required by the ECMAScript (ESM) standard, all imports must include a file extension.
+		// If the import does not include it, this rule will try to automatically detect the correct file extension.
+		'ckeditor5-rules/require-file-extensions-in-imports': [
+			'error',
+			{
+				extensions: [ '.ts', '.js', '.json' ]
+			}
+		]
 	},
 	overrides: [
 		{

packages/ckeditor5-package-generator/lib/templates/js-legacy/package.json

@@ -13,6 +13,18 @@
   ],
   "type": "module",
   "main": "src/index.js",
+  "exports": {
+    ".": "./src/index.js",
+    "./dist/index.js": "./dist/index.js",
+    "./translations/*.js": {
+      "types": "./dist/translations/*.d.ts",
+      "import": "./dist/translations/*.js"
+    },
+    "./*.css": "./dist/*.css",
+    "./build/*": "./build/*",
+		"./src/*": "./src/*",
+    "./package.json": "./package.json"
+  },
   "license": "MIT",
   "engines": {
     "node": ">=18.0.0",
@@ -27,27 +39,10 @@
     "ckeditor5-metadata.json"
   ],
   "devDependencies": {
-    "@ckeditor/ckeditor5-autoformat": ">=<%= packageVersions.ckeditor5 %>",
-    "@ckeditor/ckeditor5-basic-styles": ">=<%= packageVersions.ckeditor5 %>",
-    "@ckeditor/ckeditor5-block-quote": ">=<%= packageVersions.ckeditor5 %>",
-    "@ckeditor/ckeditor5-code-block": ">=<%= packageVersions.ckeditor5 %>",
-    "@ckeditor/ckeditor5-core": ">=<%= packageVersions.ckeditor5 %>",
     "@ckeditor/ckeditor5-dev-build-tools": "<%= packageVersions.ckeditor5DevBuildTools %>",
-    "@ckeditor/ckeditor5-editor-classic": ">=<%= packageVersions.ckeditor5 %>",
-    "@ckeditor/ckeditor5-essentials": ">=<%= packageVersions.ckeditor5 %>",
-    "@ckeditor/ckeditor5-heading": ">=<%= packageVersions.ckeditor5 %>",
-    "@ckeditor/ckeditor5-image": ">=<%= packageVersions.ckeditor5 %>",
-    "@ckeditor/ckeditor5-indent": ">=<%= packageVersions.ckeditor5 %>",
     "@ckeditor/ckeditor5-inspector": ">=<%= packageVersions.ckeditor5Inspector %>",
-    "@ckeditor/ckeditor5-link": ">=<%= packageVersions.ckeditor5 %>",
-    "@ckeditor/ckeditor5-list": ">=<%= packageVersions.ckeditor5 %>",
-    "@ckeditor/ckeditor5-media-embed": ">=<%= packageVersions.ckeditor5 %>",
     "@ckeditor/ckeditor5-package-tools": "<%= packageVersions.packageTools %>",
-    "@ckeditor/ckeditor5-paragraph": ">=<%= packageVersions.ckeditor5 %>",
-    "@ckeditor/ckeditor5-table": ">=<%= packageVersions.ckeditor5 %>",
-    "@ckeditor/ckeditor5-theme-lark": ">=<%= packageVersions.ckeditor5 %>",
-    "@ckeditor/ckeditor5-upload": ">=<%= packageVersions.ckeditor5 %>",
-    "ckeditor5": ">=<%= packageVersions.ckeditor5 %>",
+    "ckeditor5": "alpha",
     "eslint": "^7.32.0",
     "eslint-config-ckeditor5": ">=<%= packageVersions.eslintConfigCkeditor5 %>",
     "http-server": "^14.1.0",
@@ -57,7 +52,7 @@
     "stylelint-config-ckeditor5": ">=<%= packageVersions.stylelintConfigCkeditor5 %>"
   },
   "peerDependencies": {
-    "ckeditor5": ">=<%= packageVersions.ckeditor5 %>"
+    "ckeditor5": ">=42.0.0 || ^0.0.0-nightly"
   },
   "scripts": {
     "build:dist": "node ./scripts/build-dist.mjs",

packages/ckeditor5-package-generator/lib/templates/js/.eslintrc.cjs

@@ -10,11 +10,20 @@ module.exports = {
 		'dist/**'
 	],
 	rules: {
-		// This rule disallows importing core DLL packages directly. Imports should be done using the `ckeditor5` package.
-		// Also, importing non-DLL packages is not allowed. If the package requires other features to work, they should be
-		// specified as soft-requirements.
-		// Read more: https://ckeditor.com/docs/ckeditor5/latest/builds/guides/migration/migration-to-26.html#soft-requirements.
-		'ckeditor5-rules/ckeditor-imports': 'error'
+		//  This rule disallows importing from any path other than the package main entrypoint.
+		'ckeditor5-rules/allow-imports-only-from-main-package-entry-point': 'error',
+		// This rule ensures that all imports from `@ckeditor/*` packages are done through the main package entry points.
+		// This is required for the editor types to work properly and to ease migration to the installation methods
+		// introduced in CKEditor 5 version 42.0.0.
+		'ckeditor5-rules/no-legacy-imports': 'error',
+		// As required by the ECMAScript (ESM) standard, all imports must include a file extension.
+		// If the import does not include it, this rule will try to automatically detect the correct file extension.
+		'ckeditor5-rules/require-file-extensions-in-imports': [
+			'error',
+			{
+				extensions: [ '.ts', '.js', '.json' ]
+			}
+		]
 	},
 	overrides: [
 		{

packages/ckeditor5-package-generator/lib/templates/js/package.json

@@ -14,10 +14,9 @@
   "main": "dist/index.js",
   "module": "dist/index.js",
   "exports": {
-    ".": {
-      "import": "./dist/index.js"
-    },
+    ".": "./dist/index.js",
     "./translations/*.js": {
+      "types": "./dist/translations/*.d.ts",
       "import": "./dist/translations/*.js"
     },
     "./*.css": "./dist/*.css",
@@ -36,8 +35,7 @@
     "@ckeditor/ckeditor5-dev-build-tools": "<%= packageVersions.ckeditor5DevBuildTools %>",
     "@ckeditor/ckeditor5-inspector": ">=<%= packageVersions.ckeditor5Inspector %>",
     "@ckeditor/ckeditor5-package-tools": "<%= packageVersions.packageTools %>",
-    "ckeditor5": "nightly",
-    "ckeditor5-premium-features": "nightly",
+    "ckeditor5": "alpha",
     "eslint": "^7.32.0",
     "eslint-config-ckeditor5": ">=<%= packageVersions.eslintConfigCkeditor5 %>",
     "http-server": "^14.1.0",
@@ -47,8 +45,7 @@
     "stylelint-config-ckeditor5": ">=<%= packageVersions.stylelintConfigCkeditor5 %>"
   },
   "peerDependencies": {
-    "ckeditor5": "nightly",
-    "ckeditor5-premium-features": "nightly"
+    "ckeditor5": ">=42.0.0 || ^0.0.0-nightly"
   },
   "scripts": {
     "build:dist": "node ./scripts/build-dist.mjs",

packages/ckeditor5-package-generator/lib/templates/js/sample/ckeditor.js.txt

@@ -27,7 +27,7 @@ import {
 
 import <%= formattedNames.plugin.pascalCase %> from '../src/<%= formattedNames.plugin.lowerCaseMerged %>.js';
 
-import 'ckeditor5/index.css';
+import 'ckeditor5/ckeditor5.css';
 
 /* global document, window */
 

packages/ckeditor5-package-generator/lib/templates/ts-legacy/.eslintrc.cjs

@@ -24,7 +24,17 @@ module.exports = {
 		// Also, importing non-DLL packages is not allowed. If the package requires other features to work, they should be
 		// specified as soft-requirements.
 		// Read more: https://ckeditor.com/docs/ckeditor5/latest/builds/guides/migration/migration-to-26.html#soft-requirements.
-		'ckeditor5-rules/ckeditor-imports': 'error'
+		'ckeditor5-rules/ckeditor-imports': 'error',
+		//  This rule disallows importing from any path other than the package main entrypoint.
+		'ckeditor5-rules/allow-imports-only-from-main-package-entry-point': 'error',
+		// As required by the ECMAScript (ESM) standard, all imports must include a file extension.
+		// If the import does not include it, this rule will try to automatically detect the correct file extension.
+		'ckeditor5-rules/require-file-extensions-in-imports': [
+			'error',
+			{
+				extensions: [ '.ts', '.js', '.json' ]
+			}
+		]
 	},
 	overrides: [
 		{