Svelte npm run dev Complier fail - javascript

Termux
$ npm run dev
> my-app#0.0.1 dev
> vite dev
usage: vite [options]
vite: error: argument cmd: invalid choice: 'dev' (choose from 'init', 'new', 'build', 'serve')
Svelte complier run

It's not a Termux question but rather a svelte/nodejs question. However, I assume you want to run the dev server and serve your project. (This is what we typically do in our vite dev script)
Change the line "dev": "vite dev" in your package.json to "dev": "vite". This will serve your project through vite's dev server.

Related

"npm run dev" Command Doesn't Work - Giving "missing script: dev" error

I was trying to run this SVELT GitHub repo on local server:
https://github.com/fusioncharts/svelte-fusioncharts
I tried to launch it with "npm run dev" command. But I am seeing this error:
npm ERR! missing script: dev
I have tried to fix the issue by setting 'ignore-scripts' to false with this command:
npm config set ignore-scripts false
But it doesn't work.
How can I fix the issue?
npm ERR! missing script: dev means you are there isn't a script having dev. You are likely running on an incorrect directory.
Fusion charts seem to work with svelte codesandbox.
npm ERR! missing script: dev means it cannot find a script called dev inside package.json.
That makes sense!
It looks at the package.json inside the svelte-fusioncharts repo. In that file, there is a scripts property.
Notice how that property looks as follows:
"scripts": {
"build": "rollup -c",
"prepublishOnly": "npm run build"
}
It does not contain a dev script. That’s why it says there’s a missing script. Other commands will work, like npm run build or npm run prepublishOnly.
Md. Ehsanul Haque Kanan,
"scripts": {
"build": "cross-env NODE_ENV=production webpack",
"dev": "webpack-dev-server --content-base public" }
The above is the script from the examples folder in the repo: https://github.com/fusioncharts/svelte-fusioncharts/blob/develop/examples/package.json
You have missed out on the "dev" script in your package.json file.
Please check the "package.json" file in your project and just add the "dev" script as in the repo link and then retry.
Alright. I have fixed the issue. I just go inside examples folder. Then I run the following commands:
npm install
npm run dev
I had the same problem.
It is due to changes in script object in package.json by me. I had installed nodemon and to run the code, I changed the script lifecycle events start and dev in package.json to run the code via nodemon.
But even after installing nodemon, it was not reflecting in devDependencies, so I made manual entry in package.json with its version seeing from package-lock.json.
"devDependencies": {
"nodemon":"^2.0.15"
}
Making this arrangement, my code started as expected.
So, check your recent npm package installation and verify its reflection in devDependencies or dependencies in package.json.

Cannot build for production in GitHub Actions using webpack

I'm trying to deploy my project to Firebase Hosting using the following action:
on:
push:
branches:
- master
pull_request:
branches:
- master
jobs:
deploy_to_firebase_hosting:
runs-on: ubuntu-latest
steps:
- name: Checkout the repository
uses: actions/checkout#master
- name: Install Dependencies
run: npm install
- name: Build for production
run: npm run build-prod
- name: Deploy to Firebase
uses: w9jds/firebase-action#master
with:
args: deploy --only hosting
env:
FIREBASE_TOKEN: ${{ secrets.FIREBASE_TOKEN }}
The actions gets failed on Build For Production step. My build-prod script does webpack -p --mode production.
This is the error message for this failure:
> project-name#1.0.0 build-prod /home/runner/work/project-name/project-name
> webpack -p --mode production
/home/runner/work/project-name/project-name/node_modules/webpack-cli/bin/cli.js:93
throw err;
^
TypeError: Cannot convert undefined or null to object
at Function.keys (<anonymous>)
...
I've been researching about this error and I found out that people solve it by deleting node_modules before running the build. So I ran another action, without the npm install part.
It fails again on Build for production, but with a different, much reasonable error:
> webpack -p --mode production
webpack not installed
Install webpack to start bundling:
$ npm install --save-dev webpack
npm ERR! code ELIFECYCLE
npm ERR! errno 1
What's the correct way to build a production bundle in Github Actions?
Thanks!
I had the exact same issue when trying to use GitHub actions to build & deploy a production Docker container.
It turned out the issue on my side was as a result of Webpack not having access to any environment variables (which my Webpack config required) at the point of build which caused it to error out with the same error you received above.
To fix this I added the following line to my build command:
--env.NODE_ENV=production
E.g my final build command called by the container was then:
node --max_old_space_size=4096 ./node_modules/webpack/bin/webpack.js --env.NODE_ENV=production --progress --config webpack.prod.js
Hope this helps!

How to fix "'BROWSER' is not recognized as an internal or external command"?

I am trying to run react-d3-tree-demo following this README.md at https://github.com/bkrem/react-d3-tree-demo
After following the other steps, I got stuck on the second step of trying to run the app locally. The command line returns an error: "'BROWSER' is not recognized as an internal or external command, operable program or batch file," when I try to execute "npm run dev" in the react-d3-tree-demo directory that I cloned from the same repo.
The README.md page instructs to run "npm run dev" in both the react-d3-tree and react-d3-tree-demo directories. I actually got an error when I did that command in the react-d3-tree directory where the command line said the linebreak was incorrect, but I went into the eslintrc.js file and added "'linebreak-style': 0," in the module exports which resolved the error. I've tried turning off my Avast antivirus software which was suggested on another page. Nothing has worked so far.
To reproduce my problem:
Demo:
Clone this repo: git clone https://github.com/bkrem/react-d3-tree-demo.git
cd react-d3-tree-demo
Run yarn or npm install OR run bash ./setup.sh and skip to Running locally
React-D3-Tree library:
Inside the react-d3-tree-demo directory, clone the library: git clone https://github.com/bkrem/react-d3-tree.git
Run yarn or npm install
Running locally:
Set up 2 terminal windows, one in the react-d3-tree-demo directory, the other in react-d3-tree-demo/react-d3-tree (i.e. the sub-directory into which we cloned the library itself)
Run yarn dev/npm run dev in each
Any changes made to the demo app or the library should now automatically rebuild the library and reload the app with the fresh build (via nodemon).
I expect the react app to open a page at localhost:8000 that looks like this: https://bkrem.github.io/react-d3-tree-demo/ however, I get a message from the command line that was detailed earlier. I'm not sure why they told me to clone react-d3-tree inside the demo, I'd appreciate any explanation of that also.
Do an npm install of cross-env in your cloned repo:
npm install --save cross-env
Then in your cloned repo, open up package.json and change dev to this:
"dev": "cross-env BROWSER=none yarn clean:lib && webpack --progress --colors --watch --env dev",
Basically adding this to the beginning of the command: cross-env BROWSER=none
BROWSER is an environment variable, and you can use the cross-env package to properly handle it.
Now try running npm run dev again, and it should work.
There are two fixes I found that work perfectly well
Install cross-env (npm package cross-env) npm install cross-env then you change your dev script to
"electron-dev": "concurrently \"cross-env BROWSER=none yarn start\" \"wait-on http://localhost:3000 && electron .\"",
Install concurrently and run this (on windows though)
"electron-dev": "concurrently \"SET BROWSER=none&&npm run start\" \"wait-on http://localhost:3000 && electron .\""
please note that you also have to install concurrently if not already installed
i success using cross-env, so try this one:
"dev": "concurrently -k "cross-env BROWSER=none npm start" "npm:electron"",
"electron": "wait-on http://localhost:3000 && electron ."
Try this: paste this BROWSER=none in your project's .env file then save and re-run the project. Because maybe this a path related issue.

Difference between" npm run serve" and "npm run dev" in vuejs

What is the difference between npm run serve and npm run dev in vuejs. Why should i use npm run serve command to run the project
npm run serve basically is just saying "npm please run the command I defined under the name serve in package.json" the same happens with npm run dev.
Given this the commands can do the exact same thing, similar things, or very different things. Usually they are a shorthand for running a dev server on localhost, but it’s not a rule, only a convention.
So you'll need to check in your package.json file and look for
"scripts": {
"serve": "[list of commands here]",
"dev": "[list of commands here]"
},

webpack-dev-server is not recognized

I get a web pack related error when I try to run "npm run dev" as follows
'webpack-dev-server' is not recognized as an internal or external command,
operable program or batch file.
I've attached the screenshot of the error from the terminal. As well as a screenshot of the generated log.
Log
Could you please check the package.json file whether it is installed or not.
If you find webpack-dev-server present under the development dependencies but still its not working try doing an npm install to reinstall the missing packages.
If not you could simply do
npm install webpack-dev-server --save-dev
executing this would save the package under node modules directory.
you could also configure webpack dev server to a custom command under scripts in package.json
"scripts": {
"start:dev": "webpack-dev-server"
}

Categories