Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

chore: add 'optionalDependencies' to package.json #13

Draft
wants to merge 2 commits into
base: main
Choose a base branch
from
Draft
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
50 changes: 26 additions & 24 deletions package.json
Original file line number Diff line number Diff line change
Expand Up @@ -56,50 +56,52 @@
},
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I don't know much about this, but when WebOps builds for production, doesn't it already skip all the devDependencies because NODE_ENV is set to production (I'd hope)?

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@filipewl It does not because it has to run the tests and the lighthouse checks.

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

But for building the static pages, I don't think they need to install the dev dependencies...

The tests and LH checks are run on their own separate pipeline run and in these cases they do install the dev dependencies to run the proper commands.

Copy link
Contributor Author

@heitorado heitorado Apr 27, 2022

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@filipewl, indeed the devDependencies are not needed for building the static pages, as well as the tests and LH checks have separate pipelines.

However, if you look at our tekton dashboard and browse the pipelines' code, you'll notice that they share the same common task, called clone. This clone task is responsible for, among other things, running yarn install for the cloned repo in the CI environment. Since this task is shared between pipelines, we need to fill the optionalDependencies with the packages used in all pipelines, letting out only things we use locally, such as the storybook and eslint.

I agree that different tasks like clone-for-test and clone-for-build would be better, but:

  • yarn does not support other sections besides optionalDependencies. If they had support for testDependencies and buildDependencies that would be great.
  • The impact on the time is minimal as per the benchmarks I've run (adding cypress and lighthouse dependencies adds ~4s comparing to when only using the build dependencies)

We could investigate alternatives about to reduce the install time even further, maybe at webops level we could run different yarn install commands depending on the pipeline. But that is a story for another PR :)

"devDependencies": {
"@babel/core": "^7.17.8",
"@cypress/code-coverage": "^3.9.10",
"@graphql-codegen/cli": "^2.2.1",
"@graphql-codegen/typescript": "^2.2.4",
"@graphql-codegen/typescript-operations": "^2.1.8",
"@lhci/cli": "^0.9.0",
"@netlify/plugin-gatsby": "^2.0.0-beta",
"@storybook/addon-a11y": "^6.4.20",
"@storybook/addon-actions": "^6.4.20",
"@storybook/addon-essentials": "^6.4.20",
"@storybook/addon-links": "^6.4.20",
"@storybook/builder-webpack5": "^6.4.20",
"@storybook/manager-webpack5": "^6.4.20",
"@storybook/react": "^6.4.20",
"@testing-library/cypress": "^8.0.0",
"@types/cypress": "^1.1.3",
"@vtex/lighthouse-config": "^1.7.33",
"@vtex/prettier-config": "1.0.0",
"@vtex/tsconfig": "0.6.0",
"babel-loader": "^8.2.4",
"gatsby-plugin-bundle-stats": "^3.1.3",
"gatsby-plugin-postcss": "^5.3.0",
"husky": "^5.2.0",
"postcss": "^8.4.4"
},
"optionalDependencies": {
"autoprefixer": "^10.4.0",
"axe-core": "^4.3.3",
"babel-loader": "^8.2.4",
"babel-plugin-remove-graphql-queries": "^4.11.1",
"cypress": "6.6.0",
"cypress-axe": "^0.13.0",
"cypress-wait-until": "^1.7.2",
"@cypress/code-coverage": "^3.9.10",
"dotenv": "^8.2.0",
"eslint": "^7.22.0",
"eslint-config-vtex-react": "^7.0.0",
"gatsby-plugin-bundle-stats": "^3.1.3",
"gatsby-plugin-postcss": "^5.3.0",
"husky": "^5.2.0",
"@graphql-codegen/cli": "^2.2.1",
"@graphql-codegen/typescript": "^2.2.4",
"@graphql-codegen/typescript-operations": "^2.1.8",
"is-ci": "^3.0.0",
"@lhci/cli": "^0.9.0",
"lint-staged": "^10.5.4",
"postcss": "^8.4.4",
"@netlify/plugin-gatsby": "^2.0.0-beta",
"prettier": "^2.2.0",
"storybook-addon-gatsby": "^0.0.5",
"@storybook/addon-a11y": "^6.4.20",
"@storybook/addon-actions": "^6.4.20",
"@storybook/addon-essentials": "^6.4.20",
"@storybook/addon-links": "^6.4.20",
"@storybook/builder-webpack5": "^6.4.20",
"@storybook/manager-webpack5": "^6.4.20",
"@storybook/react": "^6.4.20",
"stylelint": "^14.6.0",
"stylelint-config-recess-order": "^3.0.0",
"stylelint-config-standard": "^24.0.0",
"stylelint-config-standard-scss": "^3.0.0",
"stylelint-order": "^5.0.0",
"stylelint-scss": "^4.0.1",
"@testing-library/cypress": "^8.0.0",
"tsconfig-paths-webpack-plugin": "^3.5.2",
"typescript": "^4.6.2"
"@types/cypress": "^1.1.3",
"typescript": "^4.6.2",
"@vtex/lighthouse-config": "^1.7.33",
"@vtex/prettier-config": "1.0.0",
"@vtex/tsconfig": "0.6.0"
},
"resolutions": {
"@typescript-eslint/parser": "^4",
Expand Down
1 change: 1 addition & 0 deletions vtex.env
Original file line number Diff line number Diff line change
Expand Up @@ -7,6 +7,7 @@ GATSBY_QUERY_ON_DEMAND_LOADING_INDICATOR=false
# Set to false while the WebOps team fixes the Jira's DXWP-279 issue.
USE_NODE_MODULES_CACHE=false
USE_GATSBY_CACHE=true
YARN_IGNORE_OPTIONAL_DEPS=true

# 🐞🐞 Uncomment for debugging final bundle 🐞🐞
# GATSBY_STORE_PROFILING=true