I'm trying out webpack for the first time, but I cant even get past the installation of webpack-cli
I get this error
{ Error: Cannot find module 'webpack-cli'
at Function.Module._resolveFilename (internal/modules/cjs/loader.js:580:15)
at Function.Module._load (internal/modules/cjs/loader.js:506:25)
at Module.require (internal/modules/cjs/loader.js:636:17)
at require (internal/modules/cjs/helpers.js:20:18)
at runCommand.then (C:\Users\Henrik\AppData\Roaming\npm\node_modules\webpack\bin\webpack.js:142:5)
at process._tickCallback (internal/process/next_tick.js:68:7) code: 'MODULE_NOT_FOUND' }
When I run webpack it suggest to auto install it, but fails at that.
Any suggestions?
-- EDIT 1 --
My package.json looks like this:
{
"name": "webpacktest",
"version": "1.0.0",
"description": "",
"main": "index.js",
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1"
},
"author": "",
"license": "ISC",
"devDependencies": {
"webpack-cli": "^3.2.1",
"webpack-dev-server": "^3.1.14"
},
"dependencies": {}
}
I've tried running this : "npm install webpack-cli --save-dev" amongst various other suggestions found all over the web
Try this:
npm install -g --save-dev webpack-cli
Looks like you might be trying to use a global webpack package with a local webpack-cli package.
Try adding webpack to your devDependencies and running webpack from inside an npm/yarn script, and if that doesn't work try uninstalling your global webpack binary.
I executed your package.json and it worked without any errors
Try deleting the node_modules folder and run the comand npm install from the prompt
Related
I want to try basic project from tanstack/react-table from
https://github.com/TanStack/table/tree/main/examples/react/basic
I am new in NPM. I am on Windows.
I wrote:
git clone https://github.com/TanStack/table.git
then I am going to the subfolder examples\react\basic
then I wrote:
npm install
and in subfolder "node_modules" only folders "react" and "react-dom" appeard.
There is package.json:
{
"name": "tanstack-table-example-basic",
"version": "0.0.0",
"private": true,
"scripts": {
"dev": "vite",
"build": "vite build",
"serve": "vite preview",
"start": "vite"
},
"dependencies": {
"#tanstack/react-table": "^8.2.6",
"react": "^18.2.0",
"react-dom": "^18.2.0"
},
"devDependencies": {
"#rollup/plugin-replace": "^4.0.0",
"#vitejs/plugin-react": "^1.1.3",
"vite": "^2.8.6"
}
}
Please, why the "#tanstack/react-table" package is not installed?
When I wrote:
npm start
I received message:
[ERROR] [plugin vite:dep-scan] Failed to resolve entry for package "#tanstack/react-table".
I tried to write:
npm install #tanstack/react-table -g
and folder "#tanstack/react-table" appeard in folder C:\Users...\AppData\Roaming\npm\node_modules. I copied it to project folder and start project and all was OK. But I think, it is not right way.
What am I doing bad, please?
do you want to add react-table to your own project or you just want to clone their project and run the samples ?
for the first one you should go to your project folder and write this in cmd
npm install #tanstack/react-table
for the second one you should clone their project then go to example folder
then write npm install in cmd
Edit 1
remove all the node_modules in any folder of project
run this command in main folder yarn install
run yarn install in folder examples/react/basic
run command npm start in basic folder
before start you should install yarn if you didn't have it
For instance, I want to run jest tests for one of my packages.
I set up the test script in the child package.json:
"test" : "jest"
However when I got to the package directory and run:
npm test
I get:
sh: jest: command not found
This makes sense because I've only installed jest in the root package since it is a dev dependency.
What do I need to do to make the npm package jest available in the child packages?
We're using an npm package called env-cmd https://www.npmjs.com/package/env-cmd to run scripts from root level in packages.
our root package.json looks something like this:
{
"name": "#myAwesomeApp/root",
"private": true,
"devDependencies": {
"env-cmd": "^10.1.0",
"lerna": "^5.0.0"
},
"dependencies": {
[...]
},
"workspaces": [
"packages/*"
],
"scripts": {
"internal:warning": "echo \"\n\t\\\\033[32m! ANY NOTIFICATION !\n\"",
"jest": "npm run internal:warning && env-cmd --silent lerna run test"
}
}
I try to exclude the package react-virtualized from the peer dependency checking of NPM 7. I know I could separately install that package with
npm install react-virtualized --legacy-peer-deps
...but my goal is to install all packages with npm install and this one shall not be checked for peer dependencies. Is that possible?
I would accept any answer that shows me how to manipulate the package.json so that a fresh npm install runs without peer dependency errors.
I have the following package.json:
{
"name": "test",
"version": "1.0.0",
"description": "",
"main": "index.js",
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1"
},
"keywords": [],
"author": "",
"license": "ISC",
"devDependencies": {
"react": "^17.0.2",
"react-dom": "^17.0.2",
"react-redux": "^7.2.4",
"react-router": "^5.2.0",
"react-router-dom": "^5.2.0",
"react-beautiful-dnd": "^13.1.0",
"react-device-detect": "^1.11.14",
"react-markdown": "^7.0.0",
"react-resize-detector": "^6.7.1",
"react-virtualized": "^9.22.3"
}
}
There isn't a way to do that within your own package.json as far as I am aware. The change would need to happen in the package.json for the react-virtualized package. Perhaps one of these alternatives will work for you:
Set legacy-peer-deps in a .npmrc file for your project. This won't work if people are installing your project via npm but if your project is cloned from a git repository or otherwise downloaded, and then people run npm install from there, including a .npmrc in the project should work.
Require using npm#6 which will be more lenient about peer dependency checks. You can specify the npm version in the "engines" field in your package.json.
Install react-virtualized from GitHub. The master branch (and, as of this writing, unfortunately only the master branch) has the d36509817ac44 commit which added react#17 and react-dom#17 as acceptable peer dependencies. Because this code is not in any release yet, you may be getting a version of the module that is unstable. To do this: npm install git+https://github.com/bvaughn/react-virtualized.git
Use react#16 and react-dom#16 instead of #17 for each.
With npm#>=8.3.0 use overrides in package.json:
"overrides": {
"react-virtualized": {
"react": "$react",
"react-dom": "$react-dom"
}
}
See https://docs.npmjs.com/cli/v8/configuring-npm/package-json#overrides
Bundling `index.js` [development, non-minified] 0.0% (0/1), failed.
error: bundling failed: ambiguous resolution: module `C:\Users\mtlok\Desktop\RN2\pep_beta\index.js` tries to require `react-native`, but there are several files providing this module. You can delete or fix them:
* `C:\Users\mtlok\Desktop\RN2\pep_beta\node_modules\react-native-responsive-dimensions\node_modules\react-native\package.json`
* `C:\Users\mtlok\Desktop\RN2\pep_beta\node_modules\react-native\package.json`
Im getting this error when bundling react-native app.
This issue may be caused by the react-native-responsive-dimensions package
Here is the package.json file:
{
"name": "react-native-responsive-dimensions",
"version": "1.0.1",
"description": "Resposive fontSize, height and width for your react-native components.",
"main": "src/index.js",
"scripts": {
"start": "node src/index.js",
"test": "exit 0"
},
"keywords": [
"react-native",
"responsive",
"responsive-height",
"responsive-width",
"responsive-font-size",
"fontSize",
"responsive-dimensions"
],
"author": "DaniAkash <s.daniakash#gmail.com> (https://github.com/DaniAkash)",
"repository": "DaniAkash/react-native-responsive-dimensions",
"license": "MIT",
"dependencies": {
"react-native": "x"
}
}
Also, there is a node_modules folder located inside node_modules/react-native-responsive-dimensions.
Is there a quick fix?
Try this command. maybe it's because of cache.
yarn start -- --reset-cache
or
npm start -- --reset-cache
if it doesn't work you can try react-native-git-upgrade or you can just delete node_modules folder then run npm install,react-native upgrade ande react-native-link
You can uninstall react-native-responsive-dimensions package first.
npm uninstall react-native-responsive-dimensions --save
And then
yarn start -- --reset-cache or npm start -- --reset-cache
react-native run-android or react-native run-ios
I am trying to learn react and typescript. And would like to include material-ui in my project. From there homepage I am instructed to install react-tap-event-plugin, which I did and "node_modules/react-tap-event-plugin" does exist!
Now I am supposed to to do this:
import injectTapEventPlugin from 'react-tap-event-plugin';
injectTapEventPlugin();
but the typescript compile tells me, that it cannot find the module.
I tried different variants (using require, importing node_mdules/...), but nothing worked.
How do I set this up correctly?
This is my package.json:
{
"private": true,
"scripts": {
"dev": "lite-server"
},
"dependencies": {
"react": "^0.14.0",
"react-dom": "^0.14.0",
"fbjs": "^0.2.1",
"react-tap-event-plugin": "0.2.0",
"material-ui": "^0.14.0"
}
}
You need to install definition file (.d.ts) for react-tap-event-plugin. You can do it with typings by executing the following :
if you don't have typings installed npm install typings --global
typings install dt~react-tap-event-plugin --save
Also, be sure to reference typings/index.d.ts in tsconfig.json.