0

I'm trying to go through all the Angular tutorial from the JSS.Sitecore side but I came across multiple issue.

  1. The examples don't match the code that is getting generated
  2. Getting missing modules that are not longer available online
  3. It is displaying the same component 3 times

These are my errors:

building modules 3/3 modules 0 active[HPM] Proxy created: [ '/data', '/sitecore/api/layout/render', '/sitecore/api/jss/dictionary', '/sitecore/api/jss/contentsvc' ] -> http://localhost:3042 Unable to load manifest compiler babel-core/register (normally not a problem): Cannot find module 'babel-core/register' path or pattern './sitecore/pipelines/**/*.patch.js' did not match any files. copied media from: ./sitecore/assets/sc_logo.png to: sitecore\manifest\sitecore\assets\sc_logo.png copied media from: ./sitecore/assets/sc_logo.png to: sitecore\manifest\sitecore\assets\sc_logo.png

Do I need to clone an specific branch to get the angular basic sample app working?

Improve this question
3
  • what version of JSS are you using - Tech Preview 2 or Tech Preview 3?
    – Adam Seabridge
    Apr 20, 2018 at 10:52
  • The babel-core message is just a warning and should be harmless. The displaying of the same component three times is intentional, though confusing. There appears to be a bug with a broken image in the basic angular sample as well. Can you elaborate more on issues #1 and #2?
    – nickwesselman
    Apr 20, 2018 at 20:45
  • @AdamSeabridge I installed Sitecore 9 last week using the Tech Preview 9.0.1 rev 180412. Not sure if that is 2 or 3. Also I'm running the JSS cli version 8.0.3. Now to elaborate more on issue #1. The example displayed on the sample app walkthrough, don't match the code the is getting generated by the CLI. A perfect example of the location of the <sc-placeholder> tag; the website location is showing as src/app.component.html but in the actual code is src/app/components/jss-route/jss-route.component.html
    – user1807334
    Apr 23, 2018 at 17:32

1 Answer 1

Reset to default
1

So I've just been testing this locally and here is what I did:

1) Run the jss create command like so in a new empty folder I created.

enter image description here

2) Everything seems to install ok enter image description here enter image description here

3) Cd to the new folder and run jss start, this seems to work ok:

enter image description here

enter image description here

4) Open localhost:3001 in my browser. It works but it's missing the sitecore logo for some reason (I see a 404 in the console) and the component appears to be repeated 3 times.

Is this what you mean?

enter image description here

Update

if you run this on the root folder of your app:

npm install --save-dev babel-core

That should get rid of the error and webpack will run without errors:

enter image description here

However I still see the logo error and 3 versions of the component.

Improve this answer
10
  • If you look at the route data for the basic angular sample, the repeated component is intentional. The broken image is not though!
    – nickwesselman
    Apr 20, 2018 at 20:46
  • Thanks techphoria414, seems a bit odd given the basic React example doesn't do this. Any reason it's intentional?
    – Adam Seabridge
    Apr 20, 2018 at 21:56
  • It was intended as an example of datasource and component reuse, though it is very confusing. I’ve logged internal issues for that and the broken image.
    – nickwesselman
    Apr 20, 2018 at 21:59
  • Ok thanks. Yeah I’d suggest you just go with a promo / news component so it’s something more re-world than the Sitecore welcome homepage component
    – Adam Seabridge
    Apr 20, 2018 at 22:04
  • Also what about the Babel core error. Shouldn’t that be listed in the npm config as a required module and download?
    – Adam Seabridge
    Apr 20, 2018 at 22:05

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Not the answer you're looking for? Browse other questions tagged or ask your own question.