download unexpected file when run npm install - node.js

when I run npm install karma, my node_modules download a lot of unexpected files. I dont want to upload so many not related file to git.
when I run something like npm install angular, it will only download the file of angular, which is what I want.
may I know is there any config I need to do to fix it? thanks.
screenshot of my node_modules folder:
Thanks all for your reply. below is my package.json
is there any solution other than ignore these files?
there are too many, not just the one on screenshot.
And when I run npm install -g karma, I won't see these files
>
{
"name": "app",
"version": "1.1.1",
"description": "app: An Ionic project",
"dependencies": {
"gulp": "^3.5.6",
"gulp-sass": "^2.0.4",
"gulp-concat": "^2.2.0",
"gulp-minify-css": "^0.3.0",
"gulp-rename": "^1.2.0"
},
"devDependencies": {
"bower": "^1.3.3",
"gulp-util": "^2.2.14",
"karma": "^0.13.19",
"karma-chrome-launcher": "^0.2.2",
"karma-jasmine": "^0.3.6",
"shelljs": "^0.3.0"
},
"cordovaPlugins": [
"cordova-plugin-device",
"cordova-plugin-console",
"cordova-plugin-whitelist",
"cordova-plugin-splashscreen",
"cordova-plugin-statusbar",
"ionic-plugin-keyboard"
],
"cordovaPlatforms": [
"ios",
"android"
],
"browser": {
"localforage": "./node_modules/localforage/dist/localforage.js",
"moment": "./node_modules/moment/moment.js",
"sjcl": "./node_modules/sjcl/sjcl.js",
"PouchDB": "./node_modules/pouchdb/dist/pouchdb.js"
},
"browserify": {
"transform": [
"browserify-shim"
]
},
"browserify-shim": {
"localforage": "localforage",
"moment": "moment",
"sjcl": "sjcl",
"PouchDB": "PouchDB"
}
}

These are probably modules which are sub modules of karma or some other module you are using.
If you don't want it in git, you can just ignore them by adding them to the gitignore file. In fact, you should probably add the entire node_modules folder to the file.

Related

Which part have to be published to NPM registry

I am trying to create reusable react components that I would like to publish to NPM registry.
The project folder contains the following files and folders:
The dist folder contains the output files and folders from src. As you can recognize, I am using RollupJS as a module bundler.
The question is when I publish the project to NPM registry, it is enough to publish only the dist folder, or do I have to publish all files and folders?
// rollup.config.js
import typescript from 'rollup-plugin-typescript2';
import peerDepsExternal from 'rollup-plugin-peer-deps-external';
import { nodeResolve } from '#rollup/plugin-node-resolve';
import setting from "./package.json";
export default {
input: "./src/index.tsx",
output: {
file: setting.main,
format: "es",
},
plugins: [typescript(), peerDepsExternal(), nodeResolve()]
};
The content of package.json file:
{
"name": "#example/components",
"version": "0.1.0",
"description": "React components",
"main": "./dist/index.js",
"module": "./dist/index.es.js",
"author": "anujit marty",
"license": "MIT",
"scripts": {
"build": "rollup --config"
},
"devDependencies": {
"#rollup/plugin-babel": "^5.3.0",
"#rollup/plugin-node-resolve": "^11.2.1",
"#types/react": "^17.0.3",
"#types/react-dom": "^17.0.3",
"react": "^17.0.2",
"react-dom": "^17.0.2",
"rollup": "^2.44.0",
"rollup-plugin-peer-deps-external": "^2.2.4",
"rollup-plugin-typescript2": "^0.30.0",
"tslib": "^2.1.0",
"typescript": "^4.2.3"
},
"peerDependencies": {
"react": "^17.0.2",
"react-dom": "^17.0.2"
}
}
Pushing dist to npm is enough. After you run the build command, all the files that are required for the package to run properly, are compiled into the dist folder, thus removing the need to push the entire project.

NPM requires a peer of but all peers are in package.json and node_modules

Im facing the problem that npm on install says
npm WARN eslint-config-react-app#2.0.1 requires a peer of babel-eslint#^7.2.3 but none was installed.
npm WARN eslint-config-react-app#2.0.1 requires a peer of eslint-plugin-jsx-a11y#^5.1.1 but none was installed.
npm WARN semantic-ui-react#0.74.2 requires a peer of react#>=0.14.0 <= 15 but none was installed.
npm WARN semantic-ui-react#0.74.2 requires a peer of react-dom#>=0.14.0 <= 15 but none was installed.
What I think is pretty weird is that I have in fact those dependencies in my package.json and also see them inside the node_modules folder.
My package.json:
{
"name": "react-box",
"version": "0.1.0",
"private": true,
"devDependencies": {
"autoprefixer": "7.1.4",
"babel-core": "6.26.0",
"babel-eslint": "^8.0.1",
"babel-jest": "21.2.0",
"babel-loader": "7.1.2",
"babel-preset-react-app": "^3.0.3",
"case-sensitive-paths-webpack-plugin": "2.1.1",
"chalk": "2.1.0",
"connect-history-api-fallback": "1.3.0",
"cross-spawn": "5.1.0",
"css-loader": "0.28.7",
"detect-port": "1.2.1",
"dotenv": "4.0.0",
"eslint": "4.8.0",
"eslint-config-react-app": "^2.0.1",
"eslint-loader": "1.9.0",
"eslint-plugin-flowtype": "2.38.0",
"eslint-plugin-import": "2.7.0",
"eslint-plugin-jsx-a11y": "^6.0.2",
"eslint-plugin-react": "7.4.0",
"extract-text-webpack-plugin": "3.0.1",
"file-loader": "1.1.5",
"filesize": "3.5.10",
"fs-extra": "4.0.2",
"gzip-size": "4.0.0",
"html-webpack-plugin": "2.30.1",
"http-proxy-middleware": "0.17.4",
"jest": "21.2.1",
"json-loader": "0.5.7",
"object-assign": "4.1.1",
"path-exists": "3.0.0",
"postcss-loader": "2.0.6",
"promise": "8.0.1",
"react-dev-utils": "^4.1.0",
"recursive-readdir": "2.2.1",
"strip-ansi": "4.0.0",
"style-loader": "0.19.0",
"truffle-contract": "^3.0.0",
"truffle-solidity-loader": "0.0.8",
"url-loader": "0.6.2",
"webpack": "3.6.0",
"webpack-dev-server": "2.9.1",
"webpack-manifest-plugin": "1.3.2",
"whatwg-fetch": "2.0.3"
},
"dependencies": {
"axios": "^0.16.2",
"babel-eslint": "^8.0.1",
"dotenv": "^2.0.0",
"react": "^16.0.0",
"react-countup": "^2.2.0",
"react-dom": "^16.0.0",
"semantic-ui-react": "^0.74.2"
},
"scripts": {
"start": "node scripts/start.js",
"build": "node scripts/build.js",
"test": "node scripts/test.js --env=jsdom"
},
"jest": {
"collectCoverageFrom": [
"src/**/*.{js,jsx}"
],
"setupFiles": [
"<rootDir>/config/polyfills.js"
],
"testMatch": [
"<rootDir>/src/**/__tests__/**/*.js?(x)",
"<rootDir>/src/**/?(*.)(spec|test).js?(x)"
],
"testEnvironment": "node",
"testURL": "http://localhost",
"transform": {
"^.+\\.(js|jsx)$": "<rootDir>/node_modules/babel-jest",
"^.+\\.css$": "<rootDir>/config/jest/cssTransform.js",
"^(?!.*\\.(js|jsx|css|json)$)": "<rootDir>/config/jest/fileTransform.js"
},
"transformIgnorePatterns": [
"[/\\\\]node_modules[/\\\\].+\\.(js|jsx)$"
],
"moduleNameMapper": {
"^react-native$": "react-native-web"
},
"moduleFileExtensions": [
"web.js",
"js",
"json",
"web.jsx",
"jsx"
]
},
"babel": {
"presets": [
"react-app"
]
},
"eslintConfig": {
"extends": "react-app"
}
}
When trying to install those peers manually like this:
npm install babel-eslint --save-dev
I still get the error:
├── UNMET PEER DEPENDENCY babel-eslint#8.0.1
├── UNMET PEER DEPENDENCY eslint-plugin-jsx-a11y#6.0.2
├── UNMET PEER DEPENDENCY react#16.0.0
└── UNMET PEER DEPENDENCY react-dom#16.0.0
Maybe I dont understand how NPM works but to my understanding doing the installs manually at least should solve it, right?
If anyone needs more info just comment and I will provide the additional info. Thanks!
NPM warnings about peerDeps versions mismatch are correct here. These packages are installed, but installed versions is not supported by some other packages you have.
In your case - they're too new, meaning that maintainers of warning packages are not updated yet to these versions. And restricted required peerDeps version in API-compatible range (no breaking/major version leap).
eslint-config-react-app#2.0.1 requires a peer deps: babel-eslint#^7.2.3 (i.e. 7.x.x) and eslint-plugin-jsx-a11y#^5.1.1 (i.e. 5.x.x).
Your versions is "babel-eslint": "^8.0.1" and "eslint-plugin-jsx-a11y": "^6.0.2". The first digit - major - is not matched. This is what ^ (caret) mark is about.
Same with semantic-ui-react - they does not support react#16 yet (🤗 I can't wait too!).
Until then you can install packages with exact major version:
> npm view babel-eslint#7.* version // list released versions in required range 7.x.x
babel-eslint#7.0.0 '7.0.0'
babel-eslint#7.1.0 '7.1.0'
babel-eslint#7.1.1 '7.1.1'
babel-eslint#7.2.0 '7.2.0'
babel-eslint#7.2.1 '7.2.1'
babel-eslint#7.2.2 '7.2.2'
babel-eslint#7.2.3 '7.2.3'
> npm install --save-dev babel-eslint#7.2.3 // install latest version in required range
Same with other packages.
PS: also, in package.json you have to delete duplicated records: babel-eslint and dotenv in dependencies, since they are declared in devDependencies already.

Travis give error but compiles on pc

I'm making a web server with Node.JS and use Travis-Ci to check my code. Yhe problem I got is when I commit my code, Travis gives error below, but the code compiles without an error on my pc:
./backend/server.js: 1: Syntax error: ( unexpected
Here you could find my .travis.yml file:
install:
- npm install
- npm install -g bower
- bower install bootstrap
- bower install socket.io
language: node_js
node_js:
- "6.9"
before_script:
- chmod 0777 ./backend/server.js
cache:
directories:
- node_modules
- bower_components
and the package.json
{
"name": "watchfriends",
"version": "0.0.0",
"description": "Front-end and back-end project watchfriends",
"main": "gulpfile.js",
"scripts": {
"test": "./backend/server.js"
},
"repository": {
"type": "git",
"url": "git+https://github.com/WatchFriends/Backend.git"
},
"author": "Hein P., Jasper D., Michiel V., Michiel Z.",
"license": "ISC",
"bugs": {
"url": "https://github.com/WatchFriends/Backend/issues"
},
"homepage": "https://github.com/WatchFriends/Backend#readme",
"devDependencies": {
"gulp": "^3.9.1",
"gulp-autoprefixer": "^3.1.1",
"gulp-clean-css": "^2.0.13",
"gulp-concat": "^2.6.1",
"gulp-csslint": "^1.0.0",
"gulp-htmlhint": "^0.3.1",
"gulp-jshint": "^2.0.4",
"gulp-notify": "^2.2.0",
"gulp-sass": "^2.3.2",
"gulp-sourcemaps": "^2.2.0",
"gulp-uglify": "^2.0.0",
"jshint-stylish": "^2.2.1"
},
"dependencies": {
"socket.io": "^1.5.1"
}
}
On this gist, you could find my code, including the log.
Did I something wrong?
Thanks in advance.
Travis runs npm test when testing your code.
If you check inside of your "package.json" file then you can see that the test script is set to run ./backend/server.js. You need to run the node file with node.
Change that to node ./backend/server.js and hopefully that'll work.

Install of jspm to ^0.16.34 has no registry property provided

I am fairly new to front end development and am working through Brian Noyes Aurelia Fundamentals course
I have installed the following;
node-v4.4.4x64
Git-2.8.2-64
Also I ran
npm install jspm --save-dev
and had this result
When I ran
npm install =g jspm gulp http-server
I got messages saying that the following are deprecated.
graceful-fs#3.0.8 and lodash#1.0.2
then when I ran
jsm init
I got an error
The package.json file is
{
"jspm": {},
"devDependencies": {
"jspm": "^0.16.34"
}
}
How do I fix this error?
Credit to user danzinator on github.
The fix:
Adding in the "registry": "npm" line to Package.json (even though the documentation says by default this registry should be used?)
{
"jspm": {
"registry": "npm",
"directories": {
"baseURL": "wwwroot",
"packages": "jspm_packages"
},
"devDependencies": {
"babel": "babel-core#^5.8.22",
"babel-runtime": "^5.8.20",
"browser-sync": "^2.9.3",
"core-js": "^1.1.0",
"gulp": "^3.9.0",
"gulp-tslint": "^3.2.0",
"jspm": "^0.16.2"
}
},
"devDependencies": {
"jspm": "^0.16.2",
"gulp": "^3.9.0",
"gulp-tslint": "^3.2.0",
"browser-sync": "^2.9.3"
}
}

Yeoman - Update node modules in app folder

I use Yeoman for creating and managing my apps;
after app is created, in the app's folder there are several node_modules installed (bower, grunt, grunt-cli ...)
What have I to do if I want all this node modules to be updated to their respective latest versions?
Now I manually go inside node modules' folders and run
npm update
one by one; but i wonder if there is a better way to do that...
Yeoman creates a package.json in the project's root folder; here's the file content:
{
"name": "webapp",
"version": "2.0.0",
"dependencies": {},
"devDependencies": {
"grunt": "0.4.2-0",
"grunt-contrib-copy": "~0.4.1",
"grunt-contrib-concat": "0.3.0",
"grunt-contrib-coffee": "0.7.0",
"grunt-contrib-uglify": "0.2.4",
"grunt-contrib-compass": "0.5.0",
"grunt-contrib-jshint": "~0.4.1",
"grunt-contrib-cssmin": "~0.6.0",
"grunt-contrib-connect": "~0.2.0",
"grunt-contrib-clean": "~0.4.0",
"grunt-contrib-htmlmin": "~0.1.3",
"grunt-contrib-imagemin": "~0.1.3",
"grunt-contrib-livereload": "~0.1.2",
"grunt-rev": "~0.1.0",
"grunt-usemin": "~0.1.10",
"grunt-regarde": "~0.1.1",
"grunt-mocha": "~0.3.0",
"grunt-open": "~0.2.0",
"grunt-svgmin": "~0.1.0",
"grunt-concurrent": "~0.1.0",
"matchdep": "~0.1.1",
"grunt-ember-templates": "0.4.7",
"grunt-neuter": "0.5.0"
},
"engines": {
"node": ">=0.8.0"
}
}
but if I run npm update, it says that there is no "repository field"
You can just call "npm update" in your root project folder, right where your package.json file is. It will check for updates in all local and global modules.
Yeoman should create the package.json, so it should exist anyway.

Resources