Feature/replace build system

[patrick-tolosa]

Pull request for cloudinary/frontend-frameworks

For which package is this PR?

React

What does this PR solve?

This PR solves the incorrect main properties (closes #101, #128, replaces #129)

Root cause:

The root cause of this issue is the microbundle library which makes heavy assumptions on how the package will look like.
Microbundle connects two different properties into a single use case, the output folder.

Microbundle will decide the output folder based on the main property, in our case this is problematic since on build, we want the output to be ./dist/index.js yet we want the actual value of main in package.json to be ./index.js
This contradiction, which cannot seem to be resolved by configuration, makes the library irrelevant for our use case.

Initial fix:

My initial fix was to replace microbundle with rollup, this surfaced a new problem - type declarations were being generated under ./dist/src instead of ./dist.
after some investigation, I reached this link which describes how an import from outside src will cause output directory to contain the src directory.

I then realized we're importing the package.json file to resolve the version of the package for the SDK analytics.
I replaced the package.json import with a string-replace solution.

I finished up by adding tests that ensure the build generates the desired output.

Testing:

Aside from the jest test that was added, I manually verified the package can be installed and types are accurately displayed by the IDE.

Final checklist

• Implementation is aligned to Spec.
• Tests - Add proper tests to the added code.
• Relates to a github issue (Could not find a declaration file for module '@cloudinary/react'. #128, Fix main module path #129).

[ghost]

The build breaks on node 16:

lerna ERR! npm run build exited 1 in '@cloudinary/react' lerna ERR! npm run build stdout: > @cloudinary/react@1.0.1 build > npm run build --prefix ../html && tsc && rollup -c && cp package.json ./dist > @cloudinary/html@1.0.1 build > tsc && npm run prepare-build && rollup -c > @cloudinary/html@1.0.1 prepare-build > cp package.json ./dist tsconfig.json(30,5): error TS5053: Option 'emitDeclarationOnly' cannot be specified with option 'noEmit'. tsconfig.json(36,5): error TS5053: Option 'emitDeclarationOnly' cannot be specified with option 'noEmit'. lerna ERR! npm run build stderr: src/index.ts → dist/index.js, dist/index.umd.js, dist/index.esm.js... (node:29252) [DEP0148] DeprecationWarning: Use of deprecated folder mapping "./" in the "exports" field module resolution of the package at /Users/nirmaoz/dev/frontend-frameworks/packages/html/node_modules/tslib/package.json. Update this package.json to use a subpath pattern like "./*". 

[patrick-tolosa]

The build breaks on node 16:

lerna ERR! npm run build exited 1 in '@cloudinary/react' lerna ERR! npm run build stdout: > @cloudinary/react@1.0.1 build > npm run build --prefix ../html && tsc && rollup -c && cp package.json ./dist > @cloudinary/html@1.0.1 build > tsc && npm run prepare-build && rollup -c > @cloudinary/html@1.0.1 prepare-build > cp package.json ./dist tsconfig.json(30,5): error TS5053: Option 'emitDeclarationOnly' cannot be specified with option 'noEmit'. tsconfig.json(36,5): error TS5053: Option 'emitDeclarationOnly' cannot be specified with option 'noEmit'. lerna ERR! npm run build stderr: src/index.ts → dist/index.js, dist/index.umd.js, dist/index.esm.js... (node:29252) [DEP0148] DeprecationWarning: Use of deprecated folder mapping "./" in the "exports" field module resolution of the package at /Users/nirmaoz/dev/frontend-frameworks/packages/html/node_modules/tslib/package.json. Update this package.json to use a subpath pattern like "./*". 

I believe the previous build system also doesn't run on Node 16, but I'll fix this specific TS issue.