Question 1

How do I use Shopify Web Configs in my own project?

Accepted Answer

Install the desired packages via npm, such as @shopify/babel-preset or @shopify/eslint-plugin, and extend them in your configuration files. Refer to individual package READMEs for specific setup instructions, as each package has its own documentation.

Question 2

Shopify Web Configs vs create-react-app for tooling setup?

Accepted Answer

Web Configs provides modular, configurable packages for various tools, offering more control but requiring manual integration. Create-react-app is a zero-config setup for React apps but is less flexible for custom tooling and doesn't cover as many tools like ESLint or Stylelint.

Question 3

How to customize ESLint rules in Shopify Web Configs?

Accepted Answer

You can extend the @shopify/eslint-plugin in your ESLint config and override specific rules in your project's configuration file. However, significant customizations might conflict with Shopify's enforced standards, so it's best to check the plugin's documentation.

Question 4

Does Shopify Web Configs support Vue.js or other frameworks?

Accepted Answer

The configurations are primarily optimized for React development, as seen in the Babel preset for modern JavaScript and React. Support for other frameworks like Vue.js is limited and not officially provided, so it may not be the best fit.

Question 5

What browsers are targeted by the browserslist-config package?

Accepted Answer

The @shopify/browserslist-config defines browser compatibility based on Shopify's standards, likely targeting modern browsers with support for older versions as needed for e-commerce applications, but specific details should be checked in the package README.

Question 6

How can external developers contribute to Web Configs?

Accepted Answer

External contributors can fork the repository, make changes, and submit pull requests, but they must sign a CLA and navigate the monorepo structure, which involves using pnpm and understanding the development workflow as outlined in the contribution section.

Shopify

What is Shopify?

Overview

Use Cases

Best For

Related Projects

Found a gem we're missing?

Not Ideal For

Pros & Cons

Pros

Cons

Frequently Asked Questions