build: cleanup & improvements

[mvidalgarcia]

• Fix multiple warnings showing up when building reana-ui image [1]
• Evaluate the usage of lock files (yarn.lock or package-lock.json) to freeze dependencies (pip-compile style)
• Evaluate npm vs yarn (at the moment we're using yarn in production).
• Try to avoid pinned (sub-)dependencies
  • less-loader (@semantic-ui-react/craco-less > craco-less > less-loader) pinned to 6.1.1 due to build errors in 6.1.2 [2]

[1]

yarn install v1.22.4
info No lockfile found.
[1/4] 🔍  Resolving packages...
warning less-loader > less > [email protected]: request has been deprecated, see https://github.com/request/request/issues/3142
warning node-sass > [email protected]: request has been deprecated, see https://github.com/request/request/issues/3142
warning node-sass > node-gyp > [email protected]: request has been deprecated, see https://github.com/request/request/issues/3142 
warning react-scripts > jest-environment-jsdom-fourteen > jsdom > [email protected]: request has been deprecated, see https://github.com/request/request/issues/3142
warning react-scripts > webpack-dev-server > [email protected]: Chokidar 2 will break on node v14+. Upgrade to chokidar 3 with 15x less dependencies.
warning react-scripts > webpack-dev-server > chokidar > [email protected]: fsevents 1 will break on node v14+ and could be using insecure binaries. Upgrade to fsevents 2.
warning react-scripts > babel-jest > @jest/transform > jest-haste-map > [email protected]: fsevents 1 will break on node v14+ and could be using insecure binaries. Upgrade to fsevents 2.
warning react-scripts > webpack > watchpack > watchpack-chokidar2 > [email protected]: Chokidar 2 will break on node v14+. Upgrade to chokidar 3 with 15x less dependencies.
warning react-scripts > jest > jest-cli > jest-config > jest-environment-jsdom > jsdom > [email protected]: request has been deprecated, see https://github.com/request/request/issues/3142
warning react-scripts > resolve-url-loader > rework > css > [email protected]: Please see https://github.com/lydell/urix#deprecated
warning react-scripts > resolve-url-loader > rework > css > source-map-resolve > [email protected]: Please see https://github.com/lydell/urix#deprecated
warning react-scripts > jest > jest-cli > jest-config > jest-environment-jsdom > jsdom > [email protected]: use String.prototype.padStart()
warning react-scripts > resolve-url-loader > rework > css > source-map-resolve > [email protected]: https://github.com/lydell/resolve-url#deprecated
warning react-scripts > workbox-webpack-plugin > workbox-build > strip-comments > babel-plugin-transform-object-rest-spread > babel-runtime > [email protected]: core-js@<3 is no longer maintained and not recommended for usage due to the number of issues. P
lease, upgrade your dependencies to the actual version of core-js@3.
warning semantic-ui-react > react-popper > [email protected]: You can find the new Popper v2 at @popperjs/core, this package is dedicated to the legacy v1
[2/4] 🚚  Fetching packages...
[3/4] 🔗  Linking dependencies...
warning " > [email protected]" has unmet peer dependency "webpack@^4.0.0 || ^5.0.0".
warning " > [email protected]" has unmet peer dependency "@typescript-eslint/[email protected]".
warning " > [email protected]" has unmet peer dependency "@typescript-eslint/[email protected]".
warning " > [email protected]" has unmet peer dependency "[email protected]".
warning " > [email protected]" has unmet peer dependency "[email protected] || 4.x".
warning " > [email protected]" has unmet peer dependency "[email protected]".
warning " > [email protected]" has unmet peer dependency "[email protected]".
warning " > [email protected]" has unmet peer dependency "[email protected] || 2.x".
warning "react-scripts > @typescript-eslint/eslint-plugin > [email protected]" has unmet peer dependency "typescript@>=2.8.0 || >= 3.2.0-dev || >= 3.3.0-dev || >= 3.4.0-dev || >= 3.5.0-dev || >= 3.6.0-dev || >= 3.6.0-beta || >= 3.7.0-dev || >= 3.7.0-beta".
[4/4] 🔨  Building fresh packages...
success Saved lockfile.
✨  Done in 24.43s.

[2]

Step 6/11 : RUN cd reana-ui &&     yarn &&     yarn build
 ---> Running in fb65c9f82f57
yarn install v1.22.4
warning package-lock.json found. Your project contains lock files generated by tools other than Yarn. It is advised not to mix package managers in order to avoid resolution inconsistencies caused by unsynchronized lock files. To clear this warning, remove package-lock.json.
[1/4] Resolving packages...
success Already up-to-date.
Done in 0.77s.
yarn run v1.22.4
$ craco build
Creating an optimized production build...
Failed to compile.

./node_modules/semantic-ui-less/semantic.less

@import (multiple) '../../theme.config';
^
Less resolver error:
'../../theme.config' wasn't found. Tried - /code/reana-ui/node_modules/semantic-ui-less/theme.config,../../theme.config

Webpack resolver error details:
resolve '../../theme.config' in '/code/reana-ui/node_modules/semantic-ui-less/definitions/modules'
  using description file: /code/reana-ui/node_modules/semantic-ui-less/package.json (relative path: ./definitions/modules)
    aliased with mapping '../../theme.config': '/code/reana-ui/src/semantic-ui/theme.config' to '/code/reana-ui/src/semantic-ui/theme.config'
      using description file: /code/reana-ui/node_modules/semantic-ui-less/package.json (relative path: ./definitions/modules)
        Field 'browser' doesn't contain a valid alias configuration
        using description file: /code/reana-ui/package.json (relative path: ./src/semantic-ui/theme.config)
          no extension
            Field 'browser' doesn't contain a valid alias configuration
            existing file: /code/reana-ui/src/semantic-ui/theme.config
              /code/reana-ui/src/semantic-ui/theme.config doesn't match the restriction /\.(le|c)ss$/i
          .less
            Field 'browser' doesn't contain a valid alias configuration
            /code/reana-ui/src/semantic-ui/theme.config.less doesn't exist
          .css
            Field 'browser' doesn't contain a valid alias configuration
            /code/reana-ui/src/semantic-ui/theme.config.css doesn't exist
          as directory
            /code/reana-ui/src/semantic-ui/theme.config is not a directory

Webpack resolver error missing:
/code/reana-ui/src/semantic-ui/theme.config.less,/code/reana-ui/src/semantic-ui/theme.config.css,/code/reana-ui/src/semantic-ui/theme.config

      Error in /code/reana-ui/node_modules/semantic-ui-less/definitions/modules/transition.less (line 19, column 0)


error Command failed with exit code 1.
info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command.
The command '/bin/sh -c cd reana-ui &&     yarn &&     yarn build' returned a non-zero code: 1
[2020-06-24T11:13:07] reana-ui: Command 'docker build --build-arg DEBUG=1 -t reanahub/reana-ui:latest .' returned non-zero exit status 1.

[mvidalgarcia]

webpack-contrib/less-loader#366

[mvidalgarcia]

So far we've been using yarn in PROD, and we're pushing the yarn.lock file to avoid dependency problems, so for the time being we're going to stick with it. We can reevaluate yarn vs npm in the future.

[tiborsimko]

Example:

$ craco build
Creating an optimized production build...
One of your dependencies, babel-preset-react-app, is importing the
"@babel/plugin-proposal-private-property-in-object" package without
declaring it in its dependencies. This is currently working because
"@babel/plugin-proposal-private-property-in-object" is already in your
node_modules folder for unrelated reasons, but it may break at any time.

babel-preset-react-app is part of the create-react-app project, which
is not maintianed anymore. It is thus unlikely that this bug will
ever be fixed. Add "@babel/plugin-proposal-private-property-in-object" to
your devDependencies to work around this error. This will make this message
go away.

[mdonadoni]

Example:

$ craco build
Creating an optimized production build...
One of your dependencies, babel-preset-react-app, is importing the
"@babel/plugin-proposal-private-property-in-object" package without
declaring it in its dependencies. [...]

This will be fixed by #344, but many warnings are still present when running yarn