Solved

shopify cli - ERROR update package.json

Kenyon_Kowal
Shopify Partner
12 2 11

I am running `shopify theme serve` and I am adding my build chain and I get these errors:

Screen Shot 2021-07-14 at 4.22.05 PM.png

Accepted Solutions (2)
Kenyon_Kowal
Shopify Partner
12 2 11

This is an accepted solution.

Yeah, so what I did was just make a theme folder and put the whole theme in there, and all the other build stuff in the root. Then when running theme serve, just cd into theme and do it from there 🙂

View solution in original post

Kenyon_Kowal
Shopify Partner
12 2 11

This is an accepted solution.

I would just like to update this, as there is a better solution pointed out below, which we started using. Instead of my original proposed idea of having all theme files in a ./theme folder, we put all the them files directly in the root, along with all other buildchain files (package.json, webpack, etc).

 

Harnessing the .shopifyignore file. This file is put in the root and basically tells Shopify to ignore any file you add to it, think of this like .gitignore but for Shopify.

 

Here is what mine looks like:

 

package.json
package-lock.json
tailwind.config.js
.stylelint
.eslintrc
.env.example
.env
.editorconfig
.husky
.vscode
tailwind
bs-config.json
postcss.config.json
subtree.sh
update.sh
assets

 

 

This way you can run `npm` and `shopify theme serve` in the same directly. 

View solution in original post

Replies 13 (13)

Danielkebbe84
Excursionist
18 1 3

You need to do two things to handle the 404 issues.

  1. Create redirects for the 404 URLs.
  2. Create a custom 404 page (this helps when the URL is missing but you haven’t set up the redirect yet.)

1. Create redirects for the 404 URLs

Once you see the list of URLs under the Not Found tab as shown above. Download the list of the URLs. You will have two options CSV or Google Drive. 

Once you have the sheet ready, filter out the URLs with 404 response code (on the second column of the sheet).

Now you need to create redirects for all the URLs with 404 error.  

Where should you redirect?

The main purpose of the redirection is to direct the visitor to another link with related content so that the visitor find what she was looking for or at least something close to that. Also, once you have redirected the URL to an existing URL, Google will not get 404 response anymore, which is better in terms of SEO.

i) If you are redirecting an URL of an existing page which you have changed recently, you should redirect to the new URL. For example, if you have changed yourstore.com/contactus/ to yourstore.com/contact-us/ then you should create a redirect for the same.

ii) If you have deleted the page then redirect to the Home page. However, for deleted product pages you should either redirect to a similar product or the collection page for the product. If there’s none then redirect to the home page.

How to set up redirects in Shopify

Go to your Shopify store dashboard. On the left hand sidebar click on the menu Navigation. In the page loaded you will find a link URL Redirects as shown below.

Click on the URL redirects and you will be in the page where you can add new redirects. You will see the button Add URL redirect. Once you click the button, you will get a pop-up where you can set the redirection with the old and the new URL. 

Now in the Old URL field Copy paste the path excluding your domain name of the URL, from the sheet you downloaded. In the Redirect in the new page field put the whole URL (including your domain name) to which you wish to redirect.

For example, if you want to redirect  yourstore.com/contactus/  to yourstore.com/contact-us/ then in the Old URL field put only /contactus/ and in the new page field put yourstore.com/contact-us/.

While you can do it manually this way, you can also use a Shopify SEO app to manage the redirections.

. Create a custom 404 page

You will be able to redirect the URLs only when you have detected the 404 error. That means unless you set the redirect, the visitors will land on the 404 page and most probably will bounce off your store. Here’s a fix for that.

Create a custom 404 page where you can put some content to help the visitors find what she is looking for. However, there’s no easy way to customize the 404 page template of your Shopify store. Here’s how to add elements in the 404 template by editing the theme files.

 

---
Thanks & Regards
Daniel Kebbe
qjames
Shopify Partner
10 0 9

You've misunderstood the post - this is theme configuration/shopify cli related issue

lawrevan
Shopify Partner
6 0 1

I have the same issue after running shopify theme serve. Any solutions yet?Screen Shot 2021-07-22 at 11.14.36 AM.png

Kenyon_Kowal
Shopify Partner
12 2 11

This is an accepted solution.

Yeah, so what I did was just make a theme folder and put the whole theme in there, and all the other build stuff in the root. Then when running theme serve, just cd into theme and do it from there 🙂

lawrevan
Shopify Partner
6 0 1

Thanks, this worked for me. 

Carlos_Peña
Tourist
5 0 2

@Kenyon_Kowal What do you mean by "...all the other build stuff"?

Kenyon_Kowal
Shopify Partner
12 2 11

Any files related to the buildchain, package.json, webpack files, etc.

BigSkillet
Shopify Partner
20 0 19

Using a .shopifyignore to exclude the files worked for me.

MarianaCaldas
Visitor
1 0 0

This worked for me! Thanks!

BigSkillet
Shopify Partner
20 0 19

Warning, your package.json will be overwritten if you do a shopify theme pull without the --nodelete flag, even if it's included in your .shopifyignore. There's a bug (https://github.com/Shopify/shopify-cli/issues/1518) — hopefully they'll fix it soon. 

enterprise-cd
Visitor
1 0 2

Easiest solution to this problem was solved by creating .shopifyignore and adding both json files:

 

enterprisecd_0-1637698998791.png

Now website serves with no issues.

grefelnable
Shopify Partner
1 0 0

Thank you soooo much Enterprise-Cd for this. Took me two days to find your post. Glad I found it. Keep getting those errors

Kenyon_Kowal
Shopify Partner
12 2 11

This is an accepted solution.

I would just like to update this, as there is a better solution pointed out below, which we started using. Instead of my original proposed idea of having all theme files in a ./theme folder, we put all the them files directly in the root, along with all other buildchain files (package.json, webpack, etc).

 

Harnessing the .shopifyignore file. This file is put in the root and basically tells Shopify to ignore any file you add to it, think of this like .gitignore but for Shopify.

 

Here is what mine looks like:

 

package.json
package-lock.json
tailwind.config.js
.stylelint
.eslintrc
.env.example
.env
.editorconfig
.husky
.vscode
tailwind
bs-config.json
postcss.config.json
subtree.sh
update.sh
assets

 

 

This way you can run `npm` and `shopify theme serve` in the same directly.