Fixed compile error "ERROR in src/app/person.service.ts(5,23): error…

[MarcosRZ]

I've found a bug in demo project. It involves the way fixture data is being loaded inside de service and it prevents the whole subproject to be transpiled and executed.

Steps to reproduce:

1. Clone the main repo
2. Navigate inside demo
3. Install npm deps
4. Run start script

Detailed error:

ERROR in src/app/person.service.ts(5,23): error TS2732: Cannot find module '../data/data.json'. Consider
using '--resolveJsonModule' to import module with '.json' extension.

This solution involves only typescript config and should be harmless.

Cheers!

[l-lin]

I do not reproduce your issue. What's the versions of node and npm you are using?

[MarcosRZ]

Hi, sir.

These are my versions:

➜  demo git:(master) ✗ npm -v && node -v
6.4.1
v8.15.1

And here comes 'npm start' output in detail, of course, after a successful npm install:

➜  demo git:(master) ✗ npm start

> angular-datatables-demo@7.0.1-dev start /home/project/angular-datatables/demo
> ng serve

** Angular Live Development Server is listening on localhost:4200, open your browser on http://localhost:4200/ **
 10% building modules 0/1 modules 1 active ...ion/angular-datatables/demo/src/ma 10% building modules 1/2 modules 1 active ...gular-cli-files/models/jit-polyfil 10% building modules 2/3 modules 1 active .../angular-datatables/demo/src/style 10% building modules 3/4 modules 1 active ...server/client/index.js?http://0.0. 10% building modules 4/5 modules 1 active ...gular-cli-files/models/jit-polyfil 10% building modules 5/6 modules 1 active ...les/webpack-dev-server/client/sock 10% building modules 6/7 modules 1 active ...es/webpack-dev-server/client/overl 10% building modules 7/8 modules 1 active ...bpack/hot sync nonrecursive /^\.\/ 10% building modules 7/9 modules 2 active .../angular-datatables/demo/src/style 10% building modules 8/9 modules 1 active ...bpack/hot sync nonrecursive /^\.\/ 10% building modules 8/10 modules 2 active ...t-buttons-dt/css/buttons.dataTabl 11% building modules 9/10 modules 1 active ...bpack/hot sync nonrecursive /^\.\ 11% building modules 9/11 modules 2 active ...tables.net-dt/css/jquery.dataTabl 11% building modules 10/11 modules 1 active ...bpack/hot sync nonrecursive /^\. 11% building modules 10/12 modules 2 active ...eorder-dt/css/colReorder.dataTab 11% building modules 11/12 modules 1 active ...bpack/hot sync nonrecursive /^\. 11% building modules 11/13 modules 2 active ...onsive-dt/css/responsive.dataTab 11% building modules 12/13 modules 1 active ...bpack/hot sync nonrecursive /^\. 11% building modules 12/14 modules 2 active ...net-select-dt/css/select.dataTab 11% building modules 13/14 modules 1 active ...bpack/hot sync nonrecursive /^\. 11% building modules 13/15 modules 2 active ...aterialize-css/dist/css/material 11% building modules 14/15 modules 1 active ...bpack/hot sync nonrecursive /^\. 11% building modules 14/16 modules 2 active .../angular-datatables/demo/src/sty 11% building modules 14/17 modules 3 active ...t-buttons-dt/css/buttons.dataTab 11% building modules 14/18 modules 4 active ...tables.net-dt/css/jquery.dataTab 11% building modules 14/19 modules 5 active ...eorder-dt/css/colReorder.dataTab 11% building modules 14/20 modules 6 active ...onsive-dt/css/responsive.dataTab 11% building modules 14/21 modules 7 active ...net-select-dt/css/select.dataTab 11% building modules 14/22 modules 8 active ...aterialize-css/dist/css/materialize.cssBrowserslist: caniuse-lite is outdated. Please run next command `npm update caniuse-lite browserslist`
 11% building modules 15/22 modules 7 active ...aterialize-css/dist/css/material 11% building modules 16/22 modules 6 active ...aterialize-css/dist/css/material 12% building modules 17/22 modules 5 active ...aterialize-css/dist/css/material 12% building modules 18/22 modules 4 active ...aterialize-css/dist/css/material 12% building modules 19/22 modules 3 active ...aterialize-css/dist/css/material 12% building modules 19/23 modules 4 active ...ion/angular-datatables/demo/src/ 12% building modules 19/24 modules 5 active ...ngular-datatables/demo/src/polyf 12% building modules 20/24 modules 4 active ...ngular-datatables/demo/src/polyf 12% building modules 21/24 modules 3 active ...aterialize-css/dist/css/material 12% building modules 22/24 modules 2 active ...aterialize-css/dist/css/material 12% building modules 22/25 modules 3 active ...e_modules/style-loader/lib/addSt 12% building modules 23/25 modules 2 active ...aterialize-css/dist/css/material 12% building modules 24/25 modules 1 active ...aterialize-css/dist/css/material 12% building modules 24/26 modules 2 active ...emo/node_modules/webpack/hot/emi 13% building modules 25/26 modules 1 active ...aterialize-css/dist/css/material 13% building modules 26/27 modules 1 active ...es/demo/node_modules/webpack/hot 13% building modules 27/28 modules 1 active ...o/node_modules/style-loader/lib/ 13% building modules 28/29 modules 1 active ...datatables/demo/node_modules/url 13% building modules 29/30 modules 1 active ...emo/node_modules/core-js/es7/ref 13% building modules 30/31 modules 1 active ...s/demo/node_modules/strip-ansi/i 13% building modules 31/32 modules 1 active ...o/node_modules/loglevel/lib/logl 13% building modules 32/33 modules 1 active ...es/demo/node_modules/ansi-html/i 13% building modules 33/34 modules 1 active ...atatables/demo/node_modules/url/ 14% building modules 34/35 modules 1 active ...de_modules/sockjs-client/dist/so 14% building modules 35/36 modules 1 active .../modules/es7.reflect.define-meta 14% building modules 36/37 modules 1 active .../modules/es7.reflect.delete-meta 14% building modules 37/38 modules 1 active ...-js/modules/es7.reflect.get-meta 14% building modules 38/39 modules 1 active ...odules/es7.reflect.get-metadata- 14% building modules 39/40 modules 1 active ...modules/es7.reflect.get-own-meta 14% building modules 40/41 modules 1 active ...es/es7.reflect.get-own-metadata- 14% building modules 41/42 modules 1 active ...-js/modules/es7.reflect.has-meta 15% building modules 42/43 modules 1 active ...modules/es7.reflect.has-own-meta 15% building modules 43/44 modules 1 active ...core-js/modules/es7.reflect.meta 15% building modules 44/45 modules 1 active ...o/node_modules/core-js/modules/_ 15% building modules 45/46 modules 1 active ...emo/node_modules/html-entities/i 15% building modules 46/47 modules 1 active ...bles/demo/node_modules/events/ev 15% building modules 47/48 modules 1 active ...dules/html-entities/lib/xml-enti 15% building modules 48/49 modules 1 active ...les/html-entities/lib/html4-enti 15% building modules 49/50 modules 1 active ...les/html-entities/lib/html5-enti 16% building modules 50/51 modules 1 active ...de_modules/core-js/modules/_meta 16% building modules 51/52 modules 1 active ...e_modules/core-js/modules/_an-ob 16% building modules 52/53 modules 1 active ..._modules/core-js/modules/_object 16% building modules 53/54 modules 1 active ...node_modules/core-js/modules/es6 16% building modules 54/55 modules 1 active ...core-js/modules/_array-from-iter 16% building modules 55/56 modules 1 active ..._modules/core-js/modules/_a-func 16% building modules 56/57 modules 1 active ...s/url/node_modules/punycode/puny 16% building modules 57/58 modules 1 active .../node_modules/webpack/buildin/mo 16% building modules 58/59 modules 1 active .../demo/node_modules/querystring/i 17% building modules 59/60 modules 1 active ...node_modules/core-js/modules/es6 17% building modules 60/61 modules 1 active ...node_modules/core-js/modules/_ex 17% building modules 61/62 modules 1 active ...node_modules/core-js/modules/_sh 17% building modules 62/63 modules 1 active ...modules/core-js/modules/es6.weak 17% building modules 63/64 modules 1 active ...e_modules/core-js/modules/_is-ob 17% building modules 64/65 modules 1 active ...mo/node_modules/core-js/modules/ 17% building modules 65/66 modules 1 active ...e_modules/core-js/modules/_to-ob 17% building modules 66/67 modules 1 active ..._modules/core-js/modules/_shared 18% building modules 67/68 modules 1 active ...s/core-js/modules/_collection-st 18% building modules 68/69 modules 1 active ...core-js/modules/_validate-collec 18% building modules 69/70 modules 1 active ..._modules/core-js/modules/_collec 18% building modules 70/71 modules 1 active ...node_modules/core-js/modules/_fo 18% building modules 71/72 modules 1 active ...s/demo/node_modules/ansi-regex/i 18% building modules 72/73 modules 1 active ...demo/node_modules/querystring/de 18% building modules 73/74 modules 1 active ...demo/node_modules/querystring/en 18% building modules 74/75 modules 1 active ...node_modules/core-js/modules/_gl 19% building modules 75/76 modules 1 active ...o/node_modules/core-js/modules/_ 19% building modules 76/77 modules 1 active ...de_modules/core-js/modules/_rede 19% building modules 77/78 modules 1 active ...mo/node_modules/core-js/modules/ 19% building modules 78/79 modules 1 active ...ode_modules/core-js/modules/_lib 19% building modules 79/80 modules 1 active ...dules/core-js/modules/_array-met 19% building modules 80/81 modules 1 active ...o/node_modules/core-js/modules/_ 19% building modules 81/82 modules 1 active ...dules/core-js/modules/_object-as 19% building modules 82/83 modules 1 active ...les/core-js/modules/_collection- 19% building modules 83/84 modules 1 active .../node_modules/core-js/modules/_f 20% building modules 84/85 modules 1 active ...ode_modules/core-js/modules/_def 20% building modules 85/86 modules 1 active ...mo/node_modules/core-js/modules/ 20% building modules 86/87 modules 1 active ...e_modules/core-js/modules/_objec 20% building modules 87/88 modules 1 active ...dules/core-js/modules/_object-cr 20% building modules 88/89 modules 1 active ...odules/core-js/modules/_redefine 20% building modules 89/90 modules 1 active ...modules/core-js/modules/_an-inst 20% building modules 90/91 modules 1 active ...modules/core-js/modules/_iter-de 20% building modules 91/92 modules 1 active ...e_modules/core-js/modules/_iter- 21% building modules 92/93 modules 1 active ...modules/core-js/modules/_set-spe 21% building modules 93/94 modules 1 active ...modules/core-js/modules/_descrip 21% building modules 94/95 modules 1 active ...modules/core-js/modules/_iter-de 21% building modules 95/96 modules 1 active ...s/core-js/modules/_set-to-string 21% building modules 96/97 modules 1 active ...core-js/modules/_inherit-if-requ 21% building modules 97/98 modules 1 active ...e_modules/core-js/modules/_iter- 21% building modules 98/99 modules 1 active ...dules/core-js/modules/_is-array- 21% building modules 99/100 modules 1 active ...e_modules/core-js/modules/_to-l 22% building modules 100/101 modules 1 active ...-js/modules/core.get-iterator- 22% building modules 101/102 modules 1 active ...dules/core-js/modules/_propert 22% building modules 102/103 modules 1 active ...ode_modules/core-js/modules/_i 22% building modules 103/104 modules 1 active ...ore-js/modules/_array-species- 22% building modules 104/105 modules 1 active ...modules/core-js/modules/_objec 22% building modules 105/106 modules 1 active ...modules/core-js/modules/_objec 22% building modules 106/107 modules 1 active ..._modules/core-js/modules/_obje 22% building modules 107/108 modules 1 active ...ules/core-js/modules/_ie8-dom- 22% building modules 108/109 modules 1 active ...odules/core-js/modules/_to-pri 23% building modules 109/110 modules 1 active ..._modules/core-js/modules/_obje 23% building modules 110/111 modules 1 active ...dules/core-js/modules/_enum-bu 23% building modules 111/112 modules 1 active ..._modules/core-js/modules/_dom- 23% building modules 112/113 modules 1 active ...o/node_modules/core-js/modules 23% building modules 113/114 modules 1 active ...e_modules/core-js/modules/_ite 23% building modules 114/115 modules 1 active ...modules/core-js/modules/_iter- 23% building modules 115/116 modules 1 active ...mo/node_modules/core-js/module 23% building modules 116/117 modules 1 active ...e_modules/core-js/modules/_set 24% building modules 117/118 modules 1 active ..._modules/core-js/modules/_to-i 24% building modules 118/119 modules 1 active ...ode_modules/core-js/modules/_c 24% building modules 119/120 modules 1 active ...mo/node_modules/core-js/module 24% building modules 120/121 modules 1 active ...s/modules/_array-species-const 24% building modules 121/122 modules 1 active ...ore-js/modules/_object-keys-in 24% building modules 122/123 modules 1 active ...modules/core-js/modules/_objec 24% building modules 123/124 modules 1 active ...de_modules/core-js/modules/_is 24% building modules 124/125 modules 1 active ..._modules/core-js/modules/_to-i 25% building modules 125/126 modules 1 active ...ules/core-js/modules/_array-in 25% building modules 126/127 modules 1 active ...s/core-js/modules/_to-absolute 92% after chunk asset optimization SourceMapDevToolPlugin main.js generate Sour 92% after chunk asset optimization SourceMapDevToolPlugin polyfills.js generate 92% after chunk asset optimization SourceMapDevToolPlugin runtime.js generate S 92% after chunk asset optimization SourceMapDevToolPlugin styles.js generate So 92% after chunk asset optimization SourceMapDevToolPlugin vendor.js generate So 92% after chunk asset optimization SourceMapDevToolPlugin scripts.js generate S 92% after chunk asset optimization SourceMapDevToolPlugin main.js attach Source 92% after chunk asset optimization SourceMapDevToolPlugin polyfills.js attach S 92% after chunk asset optimization SourceMapDevToolPlugin runtime.js attach Sou 92% after chunk asset optimization SourceMapDevToolPlugin styles.js attach Sour 92% after chunk asset optimization SourceMapDevToolPlugin vendor.js attach Sour 92% after chunk asset optimization SourceMapDevToolPlugin scripts.js attach Sou                                                          

...

Date: 2019-04-07T10:15:32.148Z
Hash: 9e60c28fcaeee9b8710b
Time: 6193ms
chunk {main} main.js, main.js.map (main) 1.95 kB [initial] [rendered]
chunk {polyfills} polyfills.js, polyfills.js.map (polyfills) 94.6 kB [initial] [rendered]
chunk {runtime} runtime.js, runtime.js.map (runtime) 6.22 kB [entry] [rendered]
chunk {scripts} scripts.js, scripts.js.map (scripts) 1.78 MB  [rendered]
chunk {styles} styles.js, styles.js.map (styles) 657 kB [initial] [rendered]
chunk {vendor} vendor.js, vendor.js.map (vendor) 326 kB [initial] [rendered]

ERROR in src/app/person.service.ts(5,23): error TS2732: Cannot find module '../data/data.json'. Consider using '--resolveJsonModule' to import module with '.json' extension

ℹ ｢wdm｣: Failed to compile.

It happens both on my desktop and my laptop with different Ubuntu versions. Maybe that's a configuration issue of my environment?

[l-lin]

I don't reproduce your issue with your version:

14:23:21 in angular-datatables/demo on  master is 📦 v7.0.1-dev via ⬢ v8.15.1 
➜ node -v && npm -v 
v8.15.1
6.4.1
14:23:37 in angular-datatables/demo on  master is 📦 v7.0.1-dev via ⬢ v8.15.1 
➜ rm -rff node_modules && npm i && npm start

> node-sass@4.9.3 install /home/l-lin/projects/angular-datatables/demo/node_modules/node-sass
> node scripts/install.js

Cached binary found at /home/l-lin/.npm/node-sass/4.9.3/linux-x64-57_binding.node

> node-sass@4.9.3 postinstall /home/l-lin/projects/angular-datatables/demo/node_modules/node-sass
> node scripts/build.js

Binary found at /home/l-lin/projects/angular-datatables/demo/node_modules/node-sass/vendor/linux-x64-57/binding.node
Testing binary
Binary is fine
npm WARN optional SKIPPING OPTIONAL DEPENDENCY: fsevents@1.2.4 (node_modules/fsevents):
npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for fsevents@1.2.4: wanted {"os":"darwin","arch":"any"} (current: {"os":"linux","arch":"x64
"})

added 1133 packages from 1468 contributors and audited 54334 packages in 36.214s
found 9 vulnerabilities (2 low, 4 moderate, 3 high)
  run `npm audit fix` to fix them, or `npm audit` for details

> angular-datatables-demo@7.0.1-dev start /home/l-lin/projects/angular-datatables/demo
> ng serve

** Angular Live Development Server is listening on localhost:4200, open your browser on http://localhost:4200/ **
 11% building modules 14/22 modules 8 active ...aterialize-css/dist/css/materialize.cssBrowserslist: caniuse-lite is outdated. Please run next command `npm up
date caniuse-lite browserslist`
                                                                                          
Date: 2019-04-07T12:24:45.721Z
Hash: 6705ab59837d4036f11f
Time: 20195ms
chunk {main} main.js, main.js.map (main) 247 kB [initial] [rendered]
chunk {polyfills} polyfills.js, polyfills.js.map (polyfills) 252 kB [initial] [rendered]
chunk {runtime} runtime.js, runtime.js.map (runtime) 6.22 kB [entry] [rendered]
chunk {scripts} scripts.js, scripts.js.map (scripts) 1.78 MB  [rendered]
chunk {styles} styles.js, styles.js.map (styles) 657 kB [initial] [rendered]
chunk {vendor} vendor.js, vendor.js.map (vendor) 4.16 MB [initial] [rendered]
ℹ ｢wdm｣: Compiled successfully.

I'm using NVM to install my node version. What did you use? Is it from another NodeJS version manager?

Regardless, it does not seem to produce any regression, so I will merge this PR as there might be other people that have the same issue.

[MarcosRZ]

I don't remeber the way I setup node, but I checked it and nvm is not installed in my machine. It was a manual setup, I guess.

The only thing that makes sense for me is that maybe you have installed any global package that fixes this issue in your environment, but it is not present as a dev dependency. Just as an idea.

Anyway, thanks for your attention.