Help needed for Introducing a complete toolchain & Deploying our app

MDN
#1

Hi,

I have completed the two sections on Introducing a complete toolchain & Deploying our app. Everything basically works but I have two issues that I have not been able to resolve.

1.) When I change the code, such as changing “near misses” to “pig flying”, I have to run the add/commit/push cycle to push the code to GitHub twice before the change appears on the live site on Netlify. The first commit works on 4 files & the first push enumerates 21 objects, however, the change does not appear live. The second commit works on 1 file and the second push enumerates 7 objects, and then the change appears. I have tested this twice with the same results both times.

2.) The tutorial chooses to work with npm instead of yarn. However, installing parcel-bundler appears to invoke yarn resulting in the two package managers competing for control of the project. It doesn’t appear that this can be easily avoided, although I have not set the project up from scratch again while paying particular attention to the installation of parcel stage to determine if this can be avoided. Has anyone else encountered this issue with this tutorial? Could it be related to fact that when I initially installed parcel its instructions called for it to be installed globally, so I have a global and local installation?

Thanks!

Roy

#2

Well, it seems issue 1 has somehow resolved itself, the second commit is no longer finding a lone file to commit and after a few minutes the build appears live on Netlify. I still need a resolution to the second issue.

I now have a 3rd issue. The very last section of the tutorial adds a test, which is supposed to run successfully. However, mine fails on line 3 of the test script when it cannot load “date-fns/addDays”. I do not find this folder in my node-modules folder. I suppose I could just install this package but why should it be it missing?

Thanks!

Roy

#3

Hi there @royjay!

I’m glad you are getting somewhere on this. Netlify does sometimes take a little while to redeploy.

For the parcel/date-fns issues. I think these are related. See the https://developer.mozilla.org/en-US/docs/Learn/Tools_and_testing/Understanding_client-side_tools/Introducing_complete_toolchain#Running_the_transformation section.

If you’ve grabbed the project files and then run parcel in the project directory using

npx parcel src/index.html

It should see what packages the app is trying to use, and install all the dependencies automatically so you don’t have to bother with it, including date-fns. Also, the npx tool is part of npm, so it should be using yarn to do it. That’s a little strange.

If it hasn’t installed all the dependencies correctly, perhaps because pacel wasn’t running properly, you could also install the project dependencies by running npm install in the root of the project. The project’s package.json file should reference everything it needs.

#5

Thank you for trying!