npm install bulma-start has package.json not found issue

[rkrules]

I am a complete beginner and struggling little bit to get started. Bulma-start doesn't provide instructions for npm install, but I tried npm install bulma-start and seeing below errors.

npm install bulma-start
npm WARN saveError ENOENT: no such file or directory, open '/Users/ravikiran/Apps/package.json'
npm WARN enoent ENOENT: no such file or directory, open '/Users/ravikiran/Apps/package.json'
npm WARN Apps No description
npm WARN Apps No repository field.
npm WARN Apps No README data
npm WARN Apps No license field.

• [email protected]
  updated 1 package and audited 1 package in 0.481s
  found 0 vulnerabilities

I then went the route of extracting from zip and npm install and npm start, however now I get stuck at

npm run start

[email protected] start /Users/ravikiran/Apps/demo
npm-run-all --parallel css-watch js-watch

[email protected] css-watch /Users/ravikiran/Apps/demo
npm run css-build -- --watch

[email protected] js-watch /Users/ravikiran/Apps/demo
npm run js-build -- --watch

[email protected] js-build /Users/ravikiran/Apps/demo
babel _javascript --out-dir lib "--watch"

[email protected] css-build /Users/ravikiran/Apps/demo
node-sass _sass/main.scss css/main.css "--watch"

_javascript/main.js -> lib/main.js

Isn't something more supposed to happen ?

[superjordi]

Hi @rkrules, it seems you are not running npm install and npm start in the correct path

try

edit: steps updated here

🚀

[drfinkus]

Just tried all the steps above now, I get the same error as @rkrules.

Output:

> [email protected] start /code/bulma-start-0.0.4
> npm-run-all --parallel css-watch js-watch


> [email protected] css-watch /code/bulma-start-0.0.4
> npm run css-build -- --watch


> [email protected] js-watch /code/bulma-start-0.0.4
> npm run js-build -- --watch


> [email protected] js-build /code/bulma-start-0.0.4
> babel _javascript --out-dir lib "--watch"


> [email protected] css-build /code/bulma-start-0.0.4
> node-sass _sass/main.scss css/main.css "--watch"

_javascript/main.js -> lib/main.js

Note that execution doesn't crash. Visiting localhost:8080 throws an ERR_EMPTY_RESPONSE.

[superjordi]

In which directory are you runing npm install?

Yo can know it using "pwd" in Linux or "cd" in Windows

[yujinyuz]

I'm also having the sample problem in which it just gets stuck:

❯ npm start

> [email protected] start /Users/eugene/Sources/temp/bulma-sample
> npm-run-all --parallel css-watch js-watch


> [email protected] css-watch /Users/eugene/Sources/temp/bulma-sample
> npm run css-build -- --watch


> [email protected] js-watch /Users/eugene/Sources/temp/bulma-sample
> npm run js-build -- --watch


> [email protected] css-build /Users/eugene/Sources/temp/bulma-sample
> node-sass _sass/main.scss css/main.css "--watch"


> [email protected] js-build /Users/eugene/Sources/temp/bulma-sample
> babel _javascript --out-dir lib "--watch"

_javascript/main.js -> lib/main.js

node

~/Sources/temp/bulma-sample 1m 54s
❯ node -v
v12.18.2

~/Sources/temp/bulma-sample
❯ npm -v
6.14.5

[superjordi]

Hi @yujinyuz, your output seems correct, have you tried to modify /_sass/main.scss? Does it works?

I just tried today [26/10/2020]:

step 1. download .zip from https://bulma.io/bulma-start/
step 2. right click and extract here
step 3. delete bulma-start-0.0.4.zip (optional)
step 4. rename "bulma-start-0.0.4" directory to your project's name (e.g. my-new-bulma-site)
step 5. cd my-new-bulma-site (e.g. ~/Desktop/my-new-bulma-site)
step 6. npm install
step 7. npm start
step 8. edit _sass/main.scss file (e.g. html { background-color: $green; })
step 9. save file
step 10. open index.html with your favorite browser and check if html background color is green.

If it is, you made it! 🚀