Im creating my own webpack starter template and in my recent tuning I've somehow stopped the build version from working but I have no idea what's wrong or how to debug it as there no obvious error messages or such.
In my package.json I have:
"scripts": {
"start": "webpack-serve --open --config webpack.dev.js",
"build": "webpack --config webpack.prod.js"
},
My start script runs well. The build Script is not working.
The build script does this in the terminal.
$ npm run build
> webpack-tailwind-starter-template#1.0.0 build /Users/richiekhoo/projects/webpack-tailwind-starter-template
> webpack --config webpack.prod.js
>
> and nothing more...
Debug Attemp #1
Does webpack from the CLI work?
I ran these:
$ webpack
$ webpack -v
$ webpack --version
I didn't get a 'command not found' instead the command executed provided no output and exited.
Is the issue that webpack is not running properly?
I wondered is it enough to have webpack in package.json or do I need it installed globally locally and via npm as a standalone package?
Lost as to how to work out what's wrong. Please help.
Here's the code including my webpack config files:
https://github.com/demingfactor/webpack-tailwind-starter-template
I'm running asdf and it seems there are some issues with how asdf interacts with npm.
I fixed my issue by running these commands (any of them individually could have been the fix).
$ asdf plugin-update --all
$ asdf update
$ npm i npm
I found the solutions here in the last few entries on the thread - https://github.com/asdf-vm/asdf/issues/162
Related
I'm facing this bizzare problem with my project. Here are the steps I followed
npm create vite#latest
cd to project folder.
npm i
npm run dev
This works well but the vite.config.js file is not generated. I tried to run vite but then it gives this error.
vite: The term 'vite' is not recognized as a name of a cmdlet, function, script file, or executable program. Check the spelling of the name, or if a path was included, verify that the path is correct and try again.
Also using npm run dev --host is not making it available on LAN. Works fine with live-server.
I'm using the latest npm.
I was running into a similar problem.
npm run dev|build|preview works from shell.
vite build --mode other does not work from shell.
npm exec vite -- build --mode other works from shell.
I wanted a build that would use a .env.other distinct from .env.development or .env.production.
So running:
npm exec vite -- build --mode other
npm run preview
Correctly launches VITE with site-server set to mode 'other' and correctly uses the '.env.other' ENV settings.
I have no idea why on MacOS, I was seeing VITE not properly installed as a bin by npm. I did all the tricks (delete node_modules, re-install etc.)
In my npm project, in my package.json file, I have the following lines of code:
"scripts": {
"build": "webpack"
},
While in my terminal, if I run npm webpack, I get the error message:
Unknown command: "webpack"
But if I run npm run build, I get a prompt from webpack saying I need webpack-cli... so the command is obviously recognized.
I'm confused about the different behavior of these two commands. In this case, isn't running npm run build identical to running npm webpack in my terminal? Why does one command fail and one succeed? What is actually happening when I run npm run build?
If we look at the documentation,
Environment
Package scripts run in an environment where many pieces of information are made available regarding the setup of npm and the current state of the process.
path
If you depend on modules that define executable scripts, like test suites, then those executables will be added to the PATH for executing the scripts.
Maybe this is the reason webpack is not recognized by the command line.
I have run the command
yarn add -D jest to install jest to my project.
This does successfully add jest to my node_modules
> find . -name jest
./node_modules/.bin/jest
./node_modules/jest
When I use iterm2 to run jest however I get the following output
> jest
zsh: command not found: jest
FWIW When I use the IntelliJ terminal it does work
> jest
Determining test suites to run...^C
What am I missing in the iterm environment to be able to have node_modules bin in my classpath depending on the current repo?
An OS shell doesn't know about your locally installed node_modules, but IntelliJ terminal does. So if you want to run jest from outside of an IDE you should perform several additional steps.
The most common way to run locally installed packages is to define a separate script in the "scripts" section of your package.json file. Then you will be able to run it using the yarn/npm itself from any terminal. You can find an exact example in the Yarn docs.
{
"name": "my-package",
"scripts": {
"test": "jest"
}
}
yarn run test
Or you could install jest globally so it will be accessible from anywhere, but it's not a best practice.
What does yarn build command do ?
Are yarn build and npm build the same? If not what's the difference?
yarn build and npm build are not existing commands by default. I think you mean yarn run build or npm run build.
build is a command which can be specified in your package.json file on the scripts property. See the example below.
{
"name": "mypackage",
"version": "0.1.0",
"scripts": {
"build": "webpack --config webpack.dev.js"
}
}
In this example, build is a shortcut for launching command webpack --config webpack.dev.js. You can use every keyword you want to define some shortcuts to launch commands.
And the only difference between the two commands it's the JS dependency manager you're using, yarn or npm.
More infos :
https://yarnpkg.com/lang/en/
https://www.npmjs.com/
"yarn build
Bundles the app into static files for production." from Create React App by MAD9135.
https://mad9135.github.io/F2020/modules/week3/02-react-tooling/07-create-react-app.html
yarn build is a shortcut of yarn run build
from original documentation:
Reference: https://classic.yarnpkg.com/lang/en/docs/cli/run/#toc-yarn-run-script
its the same i guess the real difference between yarn and npm is the performance and security that yarn provides.
yarn actually installing packages in parallelly and Npm only install one package at a time
And Yarn have more secure dependency.
Yarn is a package manager for your code. Yarn build makes a bundle of apps in one format and shows errors if the app has any problem that will make an error on the server.
I have created a Scala, Play project. I am trying to add Angular2 in it. I added two npm commands through edit configuration. They are suppose to install the required packages and use webpack to bundle final JS. I notice that nothing happens after 2nd script is executed (I do not know if that script is hung or there is some other issue (see pic). It seems that the 2nd npm script is stuck because on stopping the run command, I see exit code 1 - Process finished with exit code 1
Is there a way to find out if Intelli build/run process is still running?
The issue was with the 2nd script (npm start). I had to remove --profile --watch flag from the webpack command. This works - "scripts": {
"start": "webpack --config webpack.config.dev.js --progress"
}