One used to be able to initialise a vue.js 2 project with webpack using "vue init webpack client". In vue.js 3 project, from my understanding, one needs to use "vue create" to create a new project. However, this does not initialise the project with webpack. I am not finding any example of a command replacing the one used in vue.js 2, which could be used to initialise a vue.js 3 project, but only manual steps.
vue create scaffolds a Vue project that uses Webpack under the hood. Webpack is a build dependency of #vue/cli-service. You'll see it listed when running npm list webpack from the root of your scaffolded project:
$ npm list webpack
vue3-proj#0.1.0 /Users/tony/src/tmp/vue3-proj
├─┬ #vue/cli-plugin-babel#4.5.12
│ ├─┬ babel-loader#8.2.2
│ │ └── webpack#4.46.0 deduped
│ ├─┬ cache-loader#4.1.0
│ │ └── webpack#4.46.0 deduped
│ ├─┬ thread-loader#2.1.3
│ │ └── webpack#4.46.0 deduped
│ └─┬ webpack#4.46.0
│ └─┬ terser-webpack-plugin#1.4.5
│ └── webpack#4.46.0 deduped
├─┬ #vue/cli-plugin-eslint#4.5.12
│ ├─┬ eslint-loader#2.2.1
│ │ └── webpack#4.46.0 deduped
│ └── webpack#4.46.0 deduped
└─┬ #vue/cli-service#4.5.12
├─┬ #intervolga/optimize-cssnano-plugin#1.0.6
│ └── webpack#4.46.0 deduped
├─┬ #soda/friendly-errors-webpack-plugin#1.8.0
│ └── webpack#4.46.0 deduped
├─┬ #vue/preload-webpack-plugin#1.1.2
│ └── webpack#4.46.0 deduped
├─┬ copy-webpack-plugin#5.1.2
│ └── webpack#4.46.0 deduped
├─┬ css-loader#3.6.0
│ └── webpack#4.46.0 deduped
├─┬ file-loader#4.3.0
│ └── webpack#4.46.0 deduped
├─┬ html-webpack-plugin#3.2.0
│ └── webpack#4.46.0 deduped
├─┬ mini-css-extract-plugin#0.9.0
│ └── webpack#4.46.0 deduped
├─┬ terser-webpack-plugin#2.3.8
│ └── webpack#4.46.0 deduped
├─┬ url-loader#2.3.0
│ └── webpack#4.46.0 deduped
├─┬ vue-loader#15.9.6
│ └── webpack#4.46.0 deduped
├─┬ webpack-dev-server#3.11.2
│ ├─┬ webpack-dev-middleware#3.7.3
│ │ └── webpack#4.46.0 deduped
│ └── webpack#4.46.0 deduped
└── webpack#4.46.0 deduped
Related
We use webpack-bundle-analyzer to visualize what is bundled in our application and optimize it.
It appears lodash is imported, among many other lodash.* package (those package are just small part of lodash), you can visualize lodash in red in the following screenshot:
In our package.json, we only have installed lodash.* modules, and in our sources we only import those module, we never import 'lodash' directly.
This is the result of npm ls lodash:
$ npm ls lodash
PassCulture#1.199.0 /home/dka/workspace/github.com/pass-culture/pass-culture-app-native
├─┬ #lingui/cli#3.13.2
│ └─┬ inquirer#7.3.3
│ └── lodash#4.17.21 deduped
├─┬ #react-native-community/eslint-config#3.0.1
│ └─┬ eslint-plugin-flowtype#2.50.3
│ └── lodash#4.17.21 deduped
├─┬ #sentry/react-native#4.1.2
│ └─┬ #sentry/wizard#1.2.17
│ ├─┬ inquirer#6.5.2
│ │ └── lodash#4.17.21 deduped
│ └── lodash#4.17.21 deduped
├─┬ #storybook/addon-a11y#6.5.3
│ ├─┬ #storybook/api#6.5.3
│ │ └── lodash#4.17.21 deduped
│ ├─┬ #storybook/csf#0.0.2--canary.4566f4d.1
│ │ └── lodash#4.17.21 deduped
│ └── lodash#4.17.21
├─┬ #storybook/addon-actions#6.5.3
│ ├── lodash#4.17.21 deduped
│ └─┬ telejson#6.0.8
│ └── lodash#4.17.21 deduped
├─┬ #storybook/addon-essentials#6.5.3
│ ├─┬ #storybook/addon-controls#6.5.3
│ │ └── lodash#4.17.21 deduped
│ └─┬ #storybook/addon-docs#6.5.3
│ ├─┬ #storybook/mdx1-csf#0.0.1-canary.1.867dcd5.0 invalid: "canary" from node_modules/#storybook/addon-docs
│ │ └── lodash#4.17.21 deduped
│ ├─┬ #storybook/preview-web#6.5.3
│ │ └── lodash#4.17.21 deduped
│ ├─┬ #storybook/source-loader#6.5.3
│ │ └── lodash#4.17.21 deduped
│ └── lodash#4.17.21 deduped
├─┬ #storybook/addon-interactions#6.5.9
│ ├─┬ #storybook/api#6.5.9
│ │ └── lodash#4.17.21 deduped
│ └─┬ #storybook/instrumenter#6.5.9
│ └─┬ #storybook/addons#6.5.9
│ └─┬ #storybook/api#6.5.9
│ └── lodash#4.17.21 deduped
├─┬ #storybook/react#6.5.3
│ ├─┬ #storybook/core#6.5.3
│ │ ├─┬ #storybook/core-client#6.5.3
│ │ │ ├─┬ #storybook/client-api#6.5.3
│ │ │ │ └── lodash#4.17.21 deduped
│ │ │ └── lodash#4.17.21 deduped
│ │ └─┬ #storybook/core-server#6.5.3
│ │ ├─┬ #storybook/core-client#6.5.3
│ │ │ └── lodash#4.17.21 deduped
│ │ └── lodash#4.17.21 deduped
│ ├─┬ #storybook/docs-tools#6.5.3
│ │ └── lodash#4.17.21 deduped
│ ├─┬ #storybook/store#6.5.3
│ │ └── lodash#4.17.21 deduped
│ ├─┬ babel-plugin-react-docgen#4.2.1
│ │ └── lodash#4.17.21 deduped
│ └── lodash#4.17.21 deduped
├─┬ #testing-library/jest-dom#5.16.2
│ └── lodash#4.17.21 deduped
├─┬ #welldone-software/why-did-you-render#6.2.3
│ └── lodash#4.17.21 deduped
├─┬ appcenter-cli#2.10.10
│ ├─┬ inquirer#8.2.0
│ │ └── lodash#4.17.21 deduped
│ └── lodash#4.17.21 deduped
├─┬ babel-core#6.26.3
│ ├─┬ babel-generator#6.26.1
│ │ └── lodash#4.17.21 deduped
│ ├─┬ babel-register#6.26.0
│ │ └── lodash#4.17.21 deduped
│ ├─┬ babel-template#6.26.0
│ │ └── lodash#4.17.21 deduped
│ ├─┬ babel-traverse#6.26.0
│ │ └── lodash#4.17.21 deduped
│ ├─┬ babel-types#6.26.0
│ │ └── lodash#4.17.21 deduped
│ └── lodash#4.17.21 deduped
├─┬ babel-plugin-styled-components#2.0.7
│ └── lodash#4.17.21 deduped
├─┬ flipper-plugin-react-query-native-devtools#3.0.0
│ └── lodash#4.17.21 deduped
├─┬ html-webpack-plugin#4.5.2
│ ├── lodash#4.17.21 deduped
│ └─┬ pretty-error#2.1.2
│ ├── lodash#4.17.21 deduped
│ └─┬ renderkid#2.0.7
│ └── lodash#4.17.21 deduped
├─┬ jest#26.6.3
│ └─┬ #jest/core#26.6.3
│ └─┬ jest-config#26.6.3
│ └─┬ jest-environment-jsdom#26.6.2
│ └─┬ jsdom#16.7.0
│ ├─┬ data-urls#2.0.0
│ │ └─┬ whatwg-url#8.7.0
│ │ └── lodash#4.17.21 deduped
│ └─┬ whatwg-url#8.7.0
│ └── lodash#4.17.21 deduped
├─┬ optimize-css-assets-webpack-plugin#5.0.8
│ └─┬ last-call-webpack-plugin#3.0.0
│ └── lodash#4.17.21 deduped
├─┬ react-native-calendars#1.1284.0
│ └── lodash#4.17.21 deduped
├─┬ react-native#0.68.2
│ ├─┬ #react-native-community/cli-platform-android#7.0.1
│ │ ├─┬ #react-native-community/cli-tools#7.0.1
│ │ │ └── lodash#4.17.21 deduped
│ │ └── lodash#4.17.21 deduped
│ ├─┬ #react-native-community/cli-platform-ios#7.0.1
│ │ ├─┬ #react-native-community/cli-tools#7.0.1
│ │ │ └── lodash#4.17.21 deduped
│ │ └── lodash#4.17.21 deduped
│ └─┬ #react-native-community/cli#7.0.3
│ ├─┬ #react-native-community/cli-hermes#6.3.0
│ │ └─┬ #react-native-community/cli-platform-android#6.3.0
│ │ └── lodash#4.17.21 deduped
│ ├─┬ #react-native-community/cli-tools#6.2.0
│ │ └── lodash#4.17.21 deduped
│ └── lodash#4.17.21 deduped
├─┬ styled-components#5.3.3
│ └─┬ babel-plugin-styled-components#2.0.2
│ └── lodash#4.17.21 deduped
├─┬ ts-jest#26.5.6
│ └── lodash#4.17.21 deduped
├─┬ webpack-bundle-analyzer#4.5.0
│ └── lodash#4.17.21 deduped
├─┬ webpack-dev-server#3.11.3
│ ├─┬ http-proxy-middleware#0.19.1
│ │ └── lodash#4.17.21 deduped
│ └─┬ portfinder#1.0.28
│ └─┬ async#2.6.4
│ └── lodash#4.17.21 deduped
├─┬ webpack-manifest-plugin#2.2.0
│ └── lodash#4.17.21 deduped
└─┬ workbox-webpack-plugin#6.4.2
└─┬ workbox-build#6.4.2
└── lodash#4.17.21 deduped
As you can see, all the modules are devDependencies except one which is #sentry/react-native (our webapp is also a react-native app), I doubt this is the reason why lodash get bundled, but I have raised an issue sentry-wizard/issues/182 and sentry-react-native/issues/2409.
Also, the web just bundle in dev environment, but there is no node_modules folder distributed in the production build, this is how webpack work, so this whole lodash is a mystery.
Why does the whole lodash get also imported and how can I improve my bundle?
The other packages in your image are in fact not the lodash package, but other individual packaged lodash functions.
See: https://www.npmjs.com/package/lodash.debounce
If you haven't added them to your package.json, then it is likely that your dependencies did and they are bundled alongside lodash.
I personally would recommend not to optimize these imports, since they are quite small in comparison, but attempt to use tree-shakeable lodash imports, which would help much more.
i.e.
Do not
import {keyBy} from 'lodash' // Bundled as lodash.js. Though there are babel plugins that would convert this to imports below.
Do
import keyBy from 'lodash/keyBy' // Bundled as keyBy.js. One of the small squares next to lodash.js
Doing so would eliminate bundling the complete lodash.js, which your application very likely doesn't completely utilize.
I work with React v15.6.1 and Yarn and I have tried to start react app from the terminal, but when I execute command "yarn start" throw an error and not run the app
Log: yarn start
Starting the development server...
events.js:183
throw er; // Unhandled 'error' event
^
Error: watch /home/navastud/atom-workspace/intervijs/public ENOSPC
at _errnoException (util.js:1022:11)
at FSWatcher.start (fs.js:1382:19)
at Object.fs.watch (fs.js:1408:11)
at createFsWatchInstance (/home/navastud/atom-workspace/intervijs/node_modules/webpack-dev-server/node_modules/chokidar/lib/nodefs-handler.js:37:15)
at setFsWatchListener (/home/navastud/atom-workspace/intervijs/node_modules/webpack-dev-server/node_modules/chokidar/lib/nodefs-handler.js:80:15)
at FSWatcher.NodeFsHandler._watchWithNodeFs (/home/navastud/atom-workspace/intervijs/node_modules/webpack-dev-server/node_modules/chokidar/lib/nodefs-handler.js:228:14)
at FSWatcher.NodeFsHandler._handleDir (/home/navastud/atom-workspace/intervijs/node_modules/webpack-dev-server/node_modules/chokidar/lib/nodefs-handler.js:407:19)
at FSWatcher.<anonymous> (/home/navastud/atom-workspace/intervijs/node_modules/webpack-dev-server/node_modules/chokidar/lib/nodefs-handler.js:455:19)
at FSWatcher.<anonymous> (/home/navastud/atom-workspace/intervijs/node_modules/webpack-dev-server/node_modules/chokidar/lib/nodefs-handler.js:460:16)
at FSReqWrap.oncomplete (fs.js:153:5)
error Command failed with exit code 1.
info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command.
so I tried to execute the command 'npm install' but not indicated others errors.
Log: npm install
multicomp#0.1.0 /home/navastud/atom-workspace/intervijs
├─┬ eslint#5.2.0
│ ├── chalk#2.4.1
│ ├─┬ inquirer#5.2.0
│ │ └─┬ string-width#2.1.1
│ │ └─┬ strip-ansi#4.0.0
│ │ └── ansi-regex#3.0.0
│ ├─┬ js-yaml#3.12.0
│ │ └── esprima#4.0.1
│ ├─┬ strip-ansi#4.0.0
│ │ └── ansi-regex#3.0.0
│ └─┬ table#4.0.3
│ ├── UNMET PEER DEPENDENCY ajv#6.5.2
│ └── chalk#2.4.1
├─┬ eslint-config-equimper#2.2.2
│ ├─┬ babel-eslint#8.2.6
│ │ └─┬ #babel/code-frame#7.0.0-beta.44
│ │ └─┬ #babel/highlight#7.0.0-beta.44
│ │ └── chalk#2.4.1
│ ├─┬ UNMET PEER DEPENDENCY eslint#4.19.1
│ │ ├── chalk#2.4.1
│ │ ├─┬ espree#3.5.4
│ │ │ └─┬ acorn-jsx#3.0.1
│ │ │ └── acorn#3.3.0
│ │ ├── ignore#3.3.10
│ │ ├─┬ inquirer#3.3.0
│ │ │ ├── chalk#2.4.1
│ │ │ └─┬ strip-ansi#4.0.0
│ │ │ └── ansi-regex#3.0.0
│ │ ├─┬ js-yaml#3.12.0
│ │ │ └── esprima#4.0.1
│ │ └─┬ strip-ansi#4.0.0
│ │ └── ansi-regex#3.0.0
│ └─┬ eslint-plugin-class-property#1.1.0
│ └─┬ eslint#3.19.0
│ ├─┬ espree#3.5.4
│ │ └─┬ acorn-jsx#3.0.1
│ │ └── acorn#3.3.0
│ ├── ignore#3.3.10
│ └─┬ table#3.8.3
│ └─┬ string-width#2.1.1
│ └─┬ strip-ansi#4.0.0
│ └── ansi-regex#3.0.0
├── UNMET PEER DEPENDENCY react#15.6.2
├── UNMET PEER DEPENDENCY react-dom#15.6.2
└─┬ react-scripts#1.1.4
├─┬ autoprefixer#7.1.6
│ └─┬ postcss#6.0.23
│ └── chalk#2.4.1
├─┬ UNMET PEER DEPENDENCY eslint#4.10.0
│ ├── chalk#2.4.1
│ ├── eslint-scope#3.7.3
│ ├─┬ espree#3.5.4
│ │ └─┬ acorn-jsx#3.0.1
│ │ └── acorn#3.3.0
│ ├── ignore#3.3.10
│ ├─┬ js-yaml#3.12.0
│ │ └── esprima#4.0.1
│ └─┬ strip-ansi#4.0.0
│ └── ansi-regex#3.0.0
└─┬ sw-precache-webpack-plugin#0.11.4
└─┬ sw-precache#5.2.1
└─┬ update-notifier#2.5.0
├─┬ boxen#1.3.0
│ └── chalk#2.4.1
└── chalk#2.4.1
npm WARN optional Skipping failed optional dependency /react-scripts /fsevents:
npm WARN notsup Not compatible with your operating system or architecture: fsevents#1.2.4
npm WARN optional Skipping failed optional dependency /chokidar/fsevents:
npm WARN notsup Not compatible with your operating system or architecture: fsevents#1.2.4
npm WARN optional Skipping failed optional dependency /webpack-dev-server/chokidar/fsevents:
npm WARN notsup Not compatible with your operating system or architecture: fsevents#1.2.4
npm WARN ajv-keywords#3.2.0 requires a peer of ajv#^6.0.0 but none was installed.
npm WARN eslint-config-react-app#2.1.0 requires a peer of eslint#^4.1.1 but none was installed.
npm WARN eslint-loader#1.9.0 requires a peer of eslint#>=1.6.0 <5.0.0 but none was installed.
npm WARN eslint-plugin-import#2.8.0 requires a peer of eslint#2.x - 4.x but none was installed.
npm WARN eslint-plugin-jsx-a11y#5.1.1 requires a peer of eslint#^2.10.2 || ^3 || ^4 but none was installed.
npm WARN eslint-plugin-react#7.4.0 requires a peer of eslint#^3.0.0 || ^4.0.0 but none was installed.
npm WARN react-d3-speedometer#0.3.2 requires a peer of react#^0.14.7 || ^16.0.0 but none was installed.
npm WARN react-svg-gauge#1.0.8 requires a peer of react#^16.2.0 but none was installed.
npm WARN react-svg-gauge#1.0.8 requires a peer of react-dom#^16.2.0 but none was installed.
why this happens and how to resolve it?
It's difficult to say exactly why you have gotten this error, but if you remove the node_modules directory and reinstall every dependency it should work as expected.
rm -rf ./node_modules && npm install
The following command can be used:
echo fs.inotify.max_user_watches=524288 | sudo tee -a /etc/sysctl.conf && sudo sysctl -p
I have used these npm dependencies while rendering the react using node on server side.
var React = require('react');
var ReactDOMServer = require('react-dom/server');
var request = require('request');
I can not use componentDidMount because it is never called while rendering server side. So, I used componentWillMount and my final code structure is like this :
var Content = React.createClass({
displayName: 'Content',
getInitialState: function getInitialState() {
console.log('getInitialState');
return {
xyz : [],
abc : ''
};
},
componentWillMount: function componentWillMount() {
console.log('componentWillMount');
request(
'some_url',
function (error, response, body) {
console.log(response.statusCode);
if (!error && response.statusCode == 200) {
console.log('Request Call');
this.setState = {
xyz : [],
abc : ''
}
}
}.bind(this));
},
render: function render() {
console.log('render');
return React.createElement(
'div',
{
className: 'clearfix container-fluid padding-none' },
React.createElement(TopSection, { title: this.state.title, slug: this.state.slug })
);
}
});
My LifeCycle is going as follow
getInitialState
componentWillMount
render
Request Call
render
and after the render is called second time i got this error
Warning: React can't find the root component node for data-reactid
value `.1va42hea328.1.0.1`. If you're seeing this message, it
probably means that you've loaded two copies of React on the page. At this
time, only a single copy of React can be loaded at a time.
/Users/me/Desktop/Projects/silly-poke/node_modules/react/lib/ReactMount.js:715
firstChildren[0] = deepestAncestor.firstChild;
^
TypeError: Cannot read property 'firstChild' of undefined
Output of npm ls is as below :
├─┬ compression#1.6.2
│ ├─┬ accepts#1.3.3
│ │ ├─┬ mime-types#2.1.11
│ │ │ └── mime-db#1.23.0
│ │ └── negotiator#0.6.1
│ ├── bytes#2.3.0
│ ├─┬ compressible#2.0.8
│ │ └── mime-db#1.23.0
│ ├─┬ debug#2.2.0
│ │ └── ms#0.7.1
│ ├── on-headers#1.0.1
│ └── vary#1.1.0
├─┬ express#4.14.0
│ ├─┬ accepts#1.3.3
│ │ ├─┬ mime-types#2.1.11
│ │ │ └── mime-db#1.23.0
│ │ └── negotiator#0.6.1
│ ├── array-flatten#1.1.1
│ ├── content-disposition#0.5.1
│ ├── content-type#1.0.2
│ ├── cookie#0.3.1
│ ├── cookie-signature#1.0.6
│ ├─┬ debug#2.2.0
│ │ └── ms#0.7.1
│ ├── depd#1.1.0
│ ├── encodeurl#1.0.1
│ ├── escape-html#1.0.3
│ ├── etag#1.7.0
│ ├─┬ finalhandler#0.5.0
│ │ ├── statuses#1.3.0
│ │ └── unpipe#1.0.0
│ ├── fresh#0.3.0
│ ├── merge-descriptors#1.0.1
│ ├── methods#1.1.2
│ ├─┬ on-finished#2.3.0
│ │ └── ee-first#1.1.1
│ ├── parseurl#1.3.1
│ ├── path-to-regexp#0.1.7
│ ├─┬ proxy-addr#1.1.2
│ │ ├── forwarded#0.1.0
│ │ └── ipaddr.js#1.1.1
│ ├── qs#6.2.0
│ ├── range-parser#1.2.0
│ ├─┬ send#0.14.1
│ │ ├── destroy#1.0.4
│ │ ├─┬ http-errors#1.5.0
│ │ │ ├── inherits#2.0.1
│ │ │ └── setprototypeof#1.0.1
│ │ ├── mime#1.3.4
│ │ ├── ms#0.7.1
│ │ └── statuses#1.3.0
│ ├── serve-static#1.11.1
│ ├─┬ type-is#1.6.13
│ │ ├── media-typer#0.3.0
│ │ └─┬ mime-types#2.1.11
│ │ └── mime-db#1.23.0
│ ├── utils-merge#1.0.0
│ └── vary#1.1.0
├── parent-require#1.0.0
├─┬ react#0.14.8
│ ├─┬ envify#3.4.1
│ │ ├─┬ jstransform#11.0.3
│ │ │ ├── base62#1.1.1
│ │ │ ├─┬ commoner#0.10.4
│ │ │ │ ├─┬ commander#2.9.0
│ │ │ │ │ └── graceful-readlink#1.0.1
│ │ │ │ ├─┬ detective#4.3.1
│ │ │ │ │ ├── acorn#1.2.2
│ │ │ │ │ └── defined#1.0.0
│ │ │ │ ├─┬ glob#5.0.15
│ │ │ │ │ ├─┬ inflight#1.0.5
│ │ │ │ │ │ └── wrappy#1.0.2
│ │ │ │ │ ├── inherits#2.0.1
│ │ │ │ │ ├─┬ minimatch#3.0.2
│ │ │ │ │ │ └─┬ brace-expansion#1.1.5
│ │ │ │ │ │ ├── balanced-match#0.4.1
│ │ │ │ │ │ └── concat-map#0.0.1
│ │ │ │ │ ├─┬ once#1.3.3
│ │ │ │ │ │ └── wrappy#1.0.2
│ │ │ │ │ └── path-is-absolute#1.0.0
│ │ │ │ ├── graceful-fs#4.1.4
│ │ │ │ ├── iconv-lite#0.4.13
│ │ │ │ ├─┬ mkdirp#0.5.1
│ │ │ │ │ └── minimist#0.0.8
│ │ │ │ ├── private#0.1.6
│ │ │ │ ├── q#1.4.1
│ │ │ │ └─┬ recast#0.10.43
│ │ │ │ ├── ast-types#0.8.15
│ │ │ │ ├── esprima-fb#15001.1001.0-dev-harmony-fb
│ │ │ │ └── source-map#0.5.6
│ │ │ ├── esprima-fb#15001.1.0-dev-harmony-fb
│ │ │ ├── object-assign#2.1.1
│ │ │ └─┬ source-map#0.4.4
│ │ │ └── amdefine#1.0.0
│ │ └── through#2.3.8
│ └─┬ fbjs#0.6.1
│ ├── core-js#1.2.6
│ ├─┬ loose-envify#1.2.0
│ │ └── js-tokens#1.0.3
│ ├─┬ promise#7.1.1
│ │ └── asap#2.0.4
│ ├── ua-parser-js#0.7.10
│ └── whatwg-fetch#0.9.0
├── react-dom#0.14.8
└─┬ request#2.72.0
├── aws-sign2#0.6.0
├── aws4#1.4.1
├─┬ bl#1.1.2
│ └─┬ readable-stream#2.0.6
│ ├── core-util-is#1.0.2
│ ├── inherits#2.0.1
│ ├── isarray#1.0.0
│ ├── process-nextick-args#1.0.7
│ ├── string_decoder#0.10.31
│ └── util-deprecate#1.0.2
├── caseless#0.11.0
├─┬ combined-stream#1.0.5
│ └── delayed-stream#1.0.0
├── extend#3.0.0
├── forever-agent#0.6.1
├─┬ form-data#1.0.0-rc4
│ └── async#1.5.2
├─┬ har-validator#2.0.6
│ ├─┬ chalk#1.1.3
│ │ ├── ansi-styles#2.2.1
│ │ ├── escape-string-regexp#1.0.5
│ │ ├─┬ has-ansi#2.0.0
│ │ │ └── ansi-regex#2.0.0
│ │ ├─┬ strip-ansi#3.0.1
│ │ │ └── ansi-regex#2.0.0
│ │ └── supports-color#2.0.0
│ ├─┬ commander#2.9.0
│ │ └── graceful-readlink#1.0.1
│ ├─┬ is-my-json-valid#2.13.1
│ │ ├── generate-function#2.0.0
│ │ ├─┬ generate-object-property#1.2.0
│ │ │ └── is-property#1.0.2
│ │ ├── jsonpointer#2.0.0
│ │ └── xtend#4.0.1
│ └─┬ pinkie-promise#2.0.1
│ └── pinkie#2.0.4
├─┬ hawk#3.1.3
│ ├── boom#2.10.1
│ ├── cryptiles#2.0.5
│ ├── hoek#2.16.3
│ └── sntp#1.0.9
├─┬ http-signature#1.1.1
│ ├── assert-plus#0.2.0
│ ├─┬ jsprim#1.3.0
│ │ ├── extsprintf#1.0.2
│ │ ├── json-schema#0.2.2
│ │ └── verror#1.3.6
│ └─┬ sshpk#1.8.3
│ ├── asn1#0.2.3
│ ├── assert-plus#1.0.0
│ ├── dashdash#1.14.0
│ ├── ecc-jsbn#0.1.1
│ ├── getpass#0.1.6
│ ├── jodid25519#1.0.2
│ ├── jsbn#0.1.0
│ └── tweetnacl#0.13.3
├── is-typedarray#1.0.0
├── isstream#0.1.2
├── json-stringify-safe#5.0.1
├─┬ mime-types#2.1.11
│ └── mime-db#1.23.0
├── node-uuid#1.4.7
├── oauth-sign#0.8.2
├── qs#6.1.0
├── stringstream#0.0.5
├── tough-cookie#2.2.2
└── tunnel-agent#0.4.3
means there is no other version of react loading as i have seen problem on searching this error.
Your problem is you are making a request inside componentWillMount. componentWillMount is called even for server side rendering so when this request comes back it'll try to setState on a component that doesn't exist (since server side rendering uses renderToString).
Move the request to componentDidMount so it only gets called on the client.
Additionally, if you'd still like to fetch data before rendering on the server then use something like redux-async-connect.
I have uploaded a site to Openshift...I have had to make many changes...including learning about version-ing and nvm (Node Version Manager). I had to go through a lot of npm version stuff just to make the requests happen (namely, the server used express version 3.2.5, while I was using 4.2.0, locally). Anyway, now I am on this weird problem where the mongoose function - Model.findById() simply doesn't seem to be able to find an object that is clearly in the database by the _id attribute. The flow is like this (and you can see it for yourself here - http://hackabox-eamonbenproject.rhcloud.com - my project):
When I try to load a post on the page where you can view all the post info...the GET request happens, a route is called by express here:
app.get('/api/posts/:id', api.showinfo);
That api.showinfo function is this currently (although I have tried many different things):
exports.showinfo = function(req, res, next) {
var postId = req.params.id;
Post.findById(postId, function (err, post) {
console.log("what did u find?" + post);
res.send({ postinfo: post.postinfo });
//res.json(post);
});
};
That console.log("what did u find?" + post) outputs null, which means that something with mongoose's findById function is going wrong.
I have logged to make sure that postId is the correct id...so that isn't the problem. I have also tried changing res.send({ postinfo: post.postinfo }); to res.json(post), res.send(post.postinfo), res.send({ profile: post.postinfo }) - with no luck.
Does anyone know why findById might not be finding anything...the post.postinfo refers to my Mongoose virtual schema which looks like this:
PostSchema
.virtual('postinfo')
.get(function() {
return {
'_id': this._id,
'posttitle': this.posttitle,
'content': this.content,
'username': this.username,
'date': this.date
};
});
I thought using it with res.send how it is used in the user auth system in my seed might work - it is used there like this - and it works fine:
exports.show = function (req, res, next) {
var userId = req.params.id;
User.findById(userId, function (err, user) {
if (err) return next(err);
if (!user) return res.send(404);
res.send({ profile: user.profile });
});
};
For some reason when I use it with the Post model I made, it doesn't want to work on Openshift, I'm pretty sure it works locally.
Any ideas?
UPDATE
After downgrading my MongoDB version locally to 2.4.6 (same as openshift server version) - the site started having the same problems locally that it does on the server...so it is definitely an environment issue - I'm guessing that some of the packages that depend on Mongo need their versions changed too - so I am going to try that and see if that helps. It seems to be a problem with conflicting versions within the seed when I run it locally now - here are all the mongo related npm packages from my package.json file:
{
"name": "hackabox",
"version": "0.0.0",
"dependencies": {
...
"mongoose": "~3.8.8",
"connect-mongo": "mrzepinski/connect-mongo#2135988",
...
},
...
}
Does anyone know what versions to use for MongoDB v2.4.6?
UPDATE
I tried Mongoose v3.5.0 and it doesn't work - I was looking at the commit dates and it seemed like around the time that MongoDB v2.4.6 was released. What other packages need to be updated/downgraded to sync with the openshift server?
UPDATE
Did a few things, with no luck - but ultimately I ended up ssh-ing into the openshift server and running:
npm list -g --depth=0
It responded with an EACCES error - but it also spat out all the version numbers anyway - so here they are:
glob error { [Error: EACCES, readdir '/opt/rh/nodejs010/root/usr/lib/node_modules/npm/man']
errno: 3,
code: 'EACCES',
path: '/opt/rh/nodejs010/root/usr/lib/node_modules/npm/man' }
/opt/rh/nodejs010/root/usr/lib
├── abbrev#1.0.4
├── ansi#0.2.1
├── ansicolors#0.3.2
├── ansistyles#0.1.3
├── archy#0.0.2
├── asn1#0.1.11
├── assert-plus#0.1.4
├── async#0.2.9
├── aws-sign#0.3.0
├── bignumber.js#1.1.1
├── block-stream#0.0.7
├── boom#0.4.2
├── bson#0.2.3
├── buffer-crc32#0.2.1
├── bytes#0.2.1
├── child-process-close#0.1.1
├── chmodr#0.1.0
├── chownr#0.0.1
├── cmd-shim#1.1.0
├── colors#0.6.2
├── columnify#0.1.2
├── combined-stream#0.0.4
├── commander#1.1.1
├── config-chain#1.1.8
├── connect#2.7.10
├── cookie#0.1.0
├── cookie-jar#0.3.0
├── cookie-signature#1.0.1
├── couch-login#0.1.18
├── cryptiles#0.2.2
├── ctype#0.5.3
├── debug#0.7.2
├── delayed-stream#0.0.5
├── editor#0.0.5
├── express#3.2.5
├── forever-agent#0.5.0
├── form-data#0.1.1
├── formidable#1.0.14
├── fresh#0.2.0
├── fstream#0.1.25
├── fstream-ignore#0.0.7
├── fstream-npm#0.1.6
├── generic-pool#2.0.3
├── github-url-from-git#1.1.1
├── github-url-from-username-repo#0.0.2
├── glob#3.2.8
├── graceful-fs#2.0.0
├── hawk#1.0.0
├── hoek#0.9.1
├── http-signature#0.10.0
├── inherits#2.0.0
├── ini#1.1.0
├── init-package-json#0.0.14
├── json-stringify-safe#5.0.0
├── keypress#0.2.1
├── lockfile#0.4.2
├── lru-cache#2.5.0
├── methods#0.0.1
├── mime#1.2.11
├── minimatch#0.2.14
├── mkdirp#0.3.5
├── mongodb#1.3.19
├── mute-stream#0.0.4
├── mysql#2.0.0-alpha9
├── nan#0.4.4
├── node-gyp#0.12.2
├── node-static#0.6.9
├── node-uuid#1.4.1
├── nopt#2.1.2
├── normalize-package-data#0.2.8
├── npm#*
├── npm-registry-client#0.3.3
├── npm-user-validate#0.0.3
├── npmconf#0.1.12
├── npmlog#0.0.6
├── oauth-sign#0.3.0
├── once#1.3.0
├── opener#1.3.0
├── openshift-node-web-proxy#*
├── optimist#0.4.0
├── options#0.0.5
├── osenv#0.0.3
├── path-is-inside#1.0.0
├── pause#0.0.1
├── pg#0.12.3
├── promzard#0.2.0
├── proto-list#1.2.2
├── qs#0.6.5
├── range-parser#0.0.4
├── read#1.0.5
├── read-installed#0.2.4
├── read-package-json#1.1.6
├── request#2.25.0
├── require-all#0.0.8
├── retry#0.6.0
├── rimraf#2.2.6
├── semver#2.1.0
├── send#0.1.4
├── sha#1.2.1
├── sigmund#1.0.0
├── slide#1.1.5
├── sntp#0.2.4
├── supervisor#0.5.2
├── tar#0.1.19
├── text-table#0.2.0
├── tinycolor#0.0.1
├── tunnel-agent#0.3.0
├── uid-number#0.0.3
├── which#1.0.5
├── wordwrap#0.0.2
└── ws#0.4.25
Do I really need to go about making all my global npm packages the same versions as the packages that are on openshift to insure that it works (for the ones that are relevant)?
I ran npm list -g locally - and this is what I get:
/usr/lib
├─┬ bower#1.3.3
│ ├── abbrev#1.0.5
│ ├── archy#0.0.2
│ ├─┬ bower-config#0.5.0
│ │ ├── mout#0.6.0
│ │ └─┬ optimist#0.6.1
│ │ ├── minimist#0.0.8
│ │ └── wordwrap#0.0.2
│ ├── bower-endpoint-parser#0.2.1
│ ├─┬ bower-json#0.4.0
│ │ ├── deep-extend#0.2.8
│ │ └── intersect#0.0.3
│ ├── bower-logger#0.2.2
│ ├─┬ bower-registry-client#0.2.0
│ │ ├── async#0.2.10
│ │ ├─┬ bower-config#0.4.5
│ │ │ ├── mout#0.6.0
│ │ │ └─┬ optimist#0.6.1
│ │ │ ├── minimist#0.0.8
│ │ │ └── wordwrap#0.0.2
│ │ ├── lru-cache#2.3.1
│ │ ├─┬ request#2.27.0
│ │ │ ├── aws-sign#0.3.0
│ │ │ ├── cookie-jar#0.3.0
│ │ │ ├── forever-agent#0.5.2
│ │ │ ├─┬ form-data#0.1.2
│ │ │ │ └─┬ combined-stream#0.0.4
│ │ │ │ └── delayed-stream#0.0.5
│ │ │ ├─┬ hawk#1.0.0
│ │ │ │ ├── boom#0.4.2
│ │ │ │ ├── cryptiles#0.2.2
│ │ │ │ ├── hoek#0.9.1
│ │ │ │ └── sntp#0.2.4
│ │ │ ├─┬ http-signature#0.10.0
│ │ │ │ ├── asn1#0.1.11
│ │ │ │ ├── assert-plus#0.1.2
│ │ │ │ └── ctype#0.5.2
│ │ │ ├── json-stringify-safe#5.0.0
│ │ │ ├── mime#1.2.11
│ │ │ ├── node-uuid#1.4.1
│ │ │ ├── oauth-sign#0.3.0
│ │ │ ├── qs#0.6.6
│ │ │ └── tunnel-agent#0.3.0
│ │ └── request-replay#0.2.0
│ ├─┬ cardinal#0.4.4
│ │ ├── ansicolors#0.2.1
│ │ └─┬ redeyed#0.4.4
│ │ └── esprima#1.0.4
│ ├─┬ chalk#0.4.0
│ │ ├── ansi-styles#1.0.0
│ │ ├── has-color#0.1.7
│ │ └── strip-ansi#0.1.1
│ ├── chmodr#0.1.0
│ ├─┬ decompress-zip#0.0.6
│ │ ├─┬ binary#0.3.0
│ │ │ ├── buffers#0.1.1
│ │ │ └─┬ chainsaw#0.1.0
│ │ │ └── traverse#0.3.9
│ │ ├── mkpath#0.1.0
│ │ ├─┬ readable-stream#1.1.13-1
│ │ │ ├── core-util-is#1.0.1
│ │ │ ├── inherits#2.0.1
│ │ │ ├── isarray#0.0.1
│ │ │ └── string_decoder#0.10.25-1
│ │ └─┬ touch#0.0.2
│ │ └── nopt#1.0.10
│ ├─┬ fstream#0.1.25
│ │ └── inherits#2.0.1
│ ├─┬ fstream-ignore#0.0.7
│ │ ├── inherits#2.0.1
│ │ └─┬ minimatch#0.2.14
│ │ └── sigmund#1.0.0
│ ├─┬ glob#3.2.9
│ │ ├── inherits#2.0.1
│ │ └─┬ minimatch#0.2.14
│ │ └── sigmund#1.0.0
│ ├── graceful-fs#2.0.3
│ ├─┬ handlebars#1.3.0
│ │ ├─┬ optimist#0.3.7
│ │ │ └── wordwrap#0.0.2
│ │ └─┬ uglify-js#2.3.6
│ │ ├── async#0.2.10
│ │ └─┬ source-map#0.1.33
│ │ └── amdefine#0.1.0
│ ├─┬ inquirer#0.4.1
│ │ ├── async#0.2.10
│ │ ├─┬ cli-color#0.2.3
│ │ │ ├── es5-ext#0.9.2
│ │ │ └─┬ memoizee#0.2.6
│ │ │ ├── event-emitter#0.2.2
│ │ │ └── next-tick#0.1.0
│ │ ├── lodash#2.4.1
│ │ ├── mute-stream#0.0.4
│ │ ├── readline2#0.1.0
│ │ └── through#2.3.4
│ ├─┬ insight#0.3.1
│ │ ├── async#0.2.10
│ │ ├─┬ configstore#0.2.3
│ │ │ ├─┬ js-yaml#3.0.2
│ │ │ │ ├─┬ argparse#0.1.15
│ │ │ │ │ ├── underscore#1.4.4
│ │ │ │ │ └── underscore.string#2.3.3
│ │ │ │ └── esprima#1.0.4
│ │ │ └── uuid#1.4.1
│ │ ├─┬ lodash.debounce#2.4.1
│ │ │ ├── lodash.isfunction#2.4.1
│ │ │ ├─┬ lodash.isobject#2.4.1
│ │ │ │ └── lodash._objecttypes#2.4.1
│ │ │ └─┬ lodash.now#2.4.1
│ │ │ └── lodash._isnative#2.4.1
│ │ ├── object-assign#0.1.2
│ │ └─┬ request#2.27.0
│ │ ├── aws-sign#0.3.0
│ │ ├── cookie-jar#0.3.0
│ │ ├── forever-agent#0.5.2
│ │ ├─┬ form-data#0.1.2
│ │ │ └─┬ combined-stream#0.0.4
│ │ │ └── delayed-stream#0.0.5
│ │ ├─┬ hawk#1.0.0
│ │ │ ├── boom#0.4.2
│ │ │ ├── cryptiles#0.2.2
│ │ │ ├── hoek#0.9.1
│ │ │ └── sntp#0.2.4
│ │ ├─┬ http-signature#0.10.0
│ │ │ ├── asn1#0.1.11
│ │ │ ├── assert-plus#0.1.2
│ │ │ └── ctype#0.5.2
│ │ ├── json-stringify-safe#5.0.0
│ │ ├── mime#1.2.11
│ │ ├── node-uuid#1.4.1
│ │ ├── oauth-sign#0.3.0
│ │ ├── qs#0.6.6
│ │ └── tunnel-agent#0.3.0
│ ├── is-root#0.1.0
│ ├── junk#0.3.0
│ ├── lockfile#0.4.2
│ ├── lru-cache#2.5.0
│ ├── mkdirp#0.3.5
│ ├── mout#0.9.1
│ ├── nopt#2.2.0
│ ├── opn#0.1.1
│ ├── osenv#0.0.3
│ ├─┬ p-throttler#0.0.1
│ │ └── q#0.9.7
│ ├─┬ promptly#0.2.0
│ │ └─┬ read#1.0.5
│ │ └── mute-stream#0.0.4
│ ├── q#1.0.1
│ ├─┬ request#2.34.0
│ │ ├── aws-sign2#0.5.0
│ │ ├── forever-agent#0.5.2
│ │ ├─┬ form-data#0.1.2
│ │ │ ├── async#0.2.10
│ │ │ └─┬ combined-stream#0.0.4
│ │ │ └── delayed-stream#0.0.5
│ │ ├─┬ hawk#1.0.0
│ │ │ ├── boom#0.4.2
│ │ │ ├── cryptiles#0.2.2
│ │ │ ├── hoek#0.9.1
│ │ │ └── sntp#0.2.4
│ │ ├─┬ http-signature#0.10.0
│ │ │ ├── asn1#0.1.11
│ │ │ ├── assert-plus#0.1.2
│ │ │ └── ctype#0.5.2
│ │ ├── json-stringify-safe#5.0.0
│ │ ├── mime#1.2.11
│ │ ├── node-uuid#1.4.1
│ │ ├── oauth-sign#0.3.0
│ │ ├── qs#0.6.6
│ │ ├─┬ tough-cookie#0.12.1
│ │ │ └── punycode#1.2.4
│ │ └── tunnel-agent#0.3.0
│ ├─┬ request-progress#0.3.1
│ │ └── throttleit#0.0.2
│ ├── retry#0.6.0
│ ├── rimraf#2.2.6
│ ├── semver#2.2.1
│ ├─┬ shell-quote#1.4.1
│ │ ├── array-filter#0.0.1
│ │ ├── array-map#0.0.0
│ │ ├── array-reduce#0.0.0
│ │ └── jsonify#0.0.0
│ ├── stringify-object#0.2.0
│ ├─┬ tar#0.1.19
│ │ ├── block-stream#0.0.7
│ │ └── inherits#2.0.1
│ ├── tmp#0.0.23
│ ├─┬ update-notifier#0.1.8
│ │ ├─┬ configstore#0.2.3
│ │ │ ├─┬ js-yaml#3.0.2
│ │ │ │ ├─┬ argparse#0.1.15
│ │ │ │ │ ├── underscore#1.4.4
│ │ │ │ │ └── underscore.string#2.3.3
│ │ │ │ └── esprima#1.0.4
│ │ │ ├── object-assign#0.1.2
│ │ │ └── uuid#1.4.1
│ │ ├─┬ request#2.27.0
│ │ │ ├── aws-sign#0.3.0
│ │ │ ├── cookie-jar#0.3.0
│ │ │ ├── forever-agent#0.5.2
│ │ │ ├─┬ form-data#0.1.2
│ │ │ │ ├── async#0.2.10
│ │ │ │ └─┬ combined-stream#0.0.4
│ │ │ │ └── delayed-stream#0.0.5
│ │ │ ├─┬ hawk#1.0.0
│ │ │ │ ├── boom#0.4.2
│ │ │ │ ├── cryptiles#0.2.2
│ │ │ │ ├── hoek#0.9.1
│ │ │ │ └── sntp#0.2.4
│ │ │ ├─┬ http-signature#0.10.0
│ │ │ │ ├── asn1#0.1.11
│ │ │ │ ├── assert-plus#0.1.2
│ │ │ │ └── ctype#0.5.2
│ │ │ ├── json-stringify-safe#5.0.0
│ │ │ ├── mime#1.2.11
│ │ │ ├── node-uuid#1.4.1
│ │ │ ├── oauth-sign#0.3.0
│ │ │ ├── qs#0.6.6
│ │ │ └── tunnel-agent#0.3.0
│ │ └── semver#2.1.0
│ └── which#1.0.5
├─┬ express#3.2.5
│ ├── buffer-crc32#0.2.1
│ ├── commander#0.6.1
│ ├─┬ connect#2.7.10
│ │ ├── bytes#0.2.0
│ │ ├── cookie#0.0.5
│ │ ├── formidable#1.0.14
│ │ ├── pause#0.0.1
│ │ └── qs#0.6.5
│ ├── cookie#0.1.0
│ ├── cookie-signature#1.0.1
│ ├─┬ debug#1.0.4
│ │ └── ms#0.6.2
│ ├── fresh#0.1.0
│ ├── methods#0.0.1
│ ├── mkdirp#0.3.4
│ ├── range-parser#0.0.4
│ └─┬ send#0.1.0
│ └── mime#1.2.6
├─┬ express-generator#4.2.0
│ ├─┬ commander#1.3.2
│ │ └── keypress#0.1.0
│ └── mkdirp#0.3.5
├─┬ generator-angular#0.8.0
│ ├─┬ chalk#0.4.0
│ │ ├── ansi-styles#1.0.0
│ │ ├── has-color#0.1.7
│ │ └── strip-ansi#0.1.1
│ ├─┬ wiredep#1.0.0
│ │ ├─┬ chalk#0.1.1
│ │ │ ├── ansi-styles#0.1.2
│ │ │ └── has-color#0.1.7
│ │ ├─┬ glob#3.2.11
│ │ │ ├── inherits#2.0.1
│ │ │ └─┬ minimatch#0.3.0
│ │ │ ├── lru-cache#2.5.0
│ │ │ └── sigmund#1.0.0
│ │ └── lodash#1.3.1
│ └─┬ yeoman-generator#0.16.0
│ ├── async#0.2.10
│ ├─┬ cheerio#0.13.1
│ │ ├─┬ CSSselect#0.4.1
│ │ │ ├── CSSwhat#0.4.7
│ │ │ └─┬ domutils#1.4.3
│ │ │ └── domelementtype#1.1.1
│ │ ├── entities#0.5.0
│ │ ├─┬ htmlparser2#3.4.0
│ │ │ ├── domelementtype#1.1.1
│ │ │ ├── domhandler#2.2.0
│ │ │ ├── domutils#1.3.0
│ │ │ └─┬ readable-stream#1.1.13-1
│ │ │ ├── core-util-is#1.0.1
│ │ │ ├── inherits#2.0.1
│ │ │ ├── isarray#0.0.1
│ │ │ └── string_decoder#0.10.25-1
│ │ └── underscore#1.5.2
│ ├── class-extend#0.1.1
│ ├── dargs#0.1.0
│ ├── debug#0.7.4
│ ├── diff#1.0.8
│ ├─┬ download#0.1.17
│ │ ├─┬ decompress#0.2.3
│ │ │ ├── adm-zip#0.4.4
│ │ │ ├─┬ extname#0.1.2
│ │ │ │ └── ext-list#0.1.0
│ │ │ ├── map-key#0.1.4
│ │ │ ├─┬ stream-combiner#0.0.4
│ │ │ │ └── duplexer#0.1.1
│ │ │ ├─┬ tar#0.1.19
│ │ │ │ ├── block-stream#0.0.7
│ │ │ │ ├─┬ fstream#0.1.25
│ │ │ │ │ └── graceful-fs#2.0.3
│ │ │ │ └── inherits#2.0.1
│ │ │ └─┬ tempfile#0.1.3
│ │ │ └── uuid#1.4.1
│ │ ├── each-async#0.1.3
│ │ ├── get-stdin#0.1.0
│ │ ├── get-urls#0.1.2
│ │ ├─┬ nopt#2.2.1
│ │ │ └── abbrev#1.0.5
│ │ ├─┬ request#2.36.0
│ │ │ ├── aws-sign2#0.5.0
│ │ │ ├── forever-agent#0.5.2
│ │ │ ├─┬ form-data#0.1.2
│ │ │ │ └─┬ combined-stream#0.0.4
│ │ │ │ └── delayed-stream#0.0.5
│ │ │ ├─┬ hawk#1.0.0
│ │ │ │ ├── boom#0.4.2
│ │ │ │ ├── cryptiles#0.2.2
│ │ │ │ ├── hoek#0.9.1
│ │ │ │ └── sntp#0.2.4
│ │ │ ├─┬ http-signature#0.10.0
│ │ │ │ ├── asn1#0.1.11
│ │ │ │ ├── assert-plus#0.1.2
│ │ │ │ └── ctype#0.5.2
│ │ │ ├── json-stringify-safe#5.0.0
│ │ │ ├── node-uuid#1.4.1
│ │ │ ├── oauth-sign#0.3.0
│ │ │ ├── qs#0.6.6
│ │ │ ├─┬ tough-cookie#0.12.1
│ │ │ │ └── punycode#1.2.4
│ │ │ └── tunnel-agent#0.4.0
│ │ └─┬ through2#0.4.2
│ │ ├─┬ readable-stream#1.0.27-1
│ │ │ ├── core-util-is#1.0.1
│ │ │ ├── inherits#2.0.1
│ │ │ ├── isarray#0.0.1
│ │ │ └── string_decoder#0.10.25-1
│ │ └─┬ xtend#2.1.2
│ │ └── object-keys#0.4.0
│ ├─┬ file-utils#0.1.5
│ │ ├── isbinaryfile#0.1.9
│ │ ├── lodash#2.1.0
│ │ └─┬ minimatch#0.2.14
│ │ ├── lru-cache#2.5.0
│ │ └── sigmund#1.0.0
│ ├── findup-sync#0.1.3
│ ├─┬ glob#3.2.11
│ │ ├── inherits#2.0.1
│ │ └─┬ minimatch#0.3.0
│ │ ├── lru-cache#2.5.0
│ │ └── sigmund#1.0.0
│ ├── iconv-lite#0.2.11
│ ├─┬ inquirer#0.4.1
│ │ ├─┬ cli-color#0.2.3
│ │ │ ├── es5-ext#0.9.2
│ │ │ └─┬ memoizee#0.2.6
│ │ │ ├── event-emitter#0.2.2
│ │ │ └── next-tick#0.1.0
│ │ ├── mute-stream#0.0.4
│ │ ├── readline2#0.1.0
│ │ └── through#2.3.4
│ ├── isbinaryfile#2.0.1
│ ├── lodash#2.4.1
│ ├── mime#1.2.11
│ ├── mkdirp#0.3.5
│ ├─┬ request#2.30.0
│ │ ├── aws-sign2#0.5.0
│ │ ├── forever-agent#0.5.2
│ │ ├─┬ form-data#0.1.2
│ │ │ └─┬ combined-stream#0.0.4
│ │ │ └── delayed-stream#0.0.5
│ │ ├─┬ hawk#1.0.0
│ │ │ ├── boom#0.4.2
│ │ │ ├── cryptiles#0.2.2
│ │ │ ├── hoek#0.9.1
│ │ │ └── sntp#0.2.4
│ │ ├─┬ http-signature#0.10.0
│ │ │ ├── asn1#0.1.11
│ │ │ ├── assert-plus#0.1.2
│ │ │ └── ctype#0.5.2
│ │ ├── json-stringify-safe#5.0.0
│ │ ├── node-uuid#1.4.1
│ │ ├── oauth-sign#0.3.0
│ │ ├── qs#0.6.6
│ │ ├─┬ tough-cookie#0.9.15
│ │ │ └── punycode#1.2.4
│ │ └── tunnel-agent#0.3.0
│ ├── rimraf#2.2.8
│ ├── shelljs#0.2.6
│ ├── text-table#0.2.0
│ └── underscore.string#2.3.3
├─┬ generator-angular-fullstack#1.4.2
│ ├─┬ chalk#0.4.0
│ │ ├── ansi-styles#1.0.0
│ │ ├── has-color#0.1.7
│ │ └── strip-ansi#0.1.1
│ ├─┬ wiredep#0.4.2
│ │ ├─┬ chalk#0.1.1
│ │ │ ├── ansi-styles#0.1.2
│ │ │ └── has-color#0.1.7
│ │ └── lodash#1.3.1
│ └─┬ yeoman-generator#0.16.0
│ ├── async#0.2.10
│ ├─┬ cheerio#0.13.1
│ │ ├─┬ CSSselect#0.4.1
│ │ │ ├── CSSwhat#0.4.5
│ │ │ └─┬ domutils#1.4.3
│ │ │ └── domelementtype#1.1.1
│ │ ├── entities#0.5.0
│ │ ├─┬ htmlparser2#3.4.0
│ │ │ ├── domelementtype#1.1.1
│ │ │ ├── domhandler#2.2.0
│ │ │ ├── domutils#1.3.0
│ │ │ └─┬ readable-stream#1.1.13-1
│ │ │ ├── core-util-is#1.0.1
│ │ │ ├── inherits#2.0.1
│ │ │ ├── isarray#0.0.1
│ │ │ └── string_decoder#0.10.25-1
│ │ └── underscore#1.5.2
│ ├── class-extend#0.1.1
│ ├── dargs#0.1.0
│ ├── debug#0.7.4
│ ├── diff#1.0.8
│ ├─┬ download#0.1.16
│ │ ├─┬ decompress#0.2.3
│ │ │ ├── adm-zip#0.4.4
│ │ │ ├─┬ extname#0.1.2
│ │ │ │ └── ext-list#0.1.0
│ │ │ ├─┬ map-key#0.1.1
│ │ │ │ └── mout#0.9.1
│ │ │ ├─┬ stream-combiner#0.0.4
│ │ │ │ └── duplexer#0.1.1
│ │ │ ├─┬ tar#0.1.19
│ │ │ │ ├── block-stream#0.0.7
│ │ │ │ ├─┬ fstream#0.1.25
│ │ │ │ │ └── graceful-fs#2.0.3
│ │ │ │ └── inherits#2.0.1
│ │ │ └─┬ tempfile#0.1.3
│ │ │ └── uuid#1.4.1
│ │ ├── each-async#0.1.2
│ │ ├── get-stdin#0.1.0
│ │ ├── get-urls#0.1.1
│ │ ├─┬ nopt#2.2.0
│ │ │ └── abbrev#1.0.5
│ │ ├─┬ request#2.34.0
│ │ │ ├── aws-sign2#0.5.0
│ │ │ ├── forever-agent#0.5.2
│ │ │ ├─┬ form-data#0.1.2
│ │ │ │ └─┬ combined-stream#0.0.4
│ │ │ │ └── delayed-stream#0.0.5
│ │ │ ├─┬ hawk#1.0.0
│ │ │ │ ├── boom#0.4.2
│ │ │ │ ├── cryptiles#0.2.2
│ │ │ │ ├── hoek#0.9.1
│ │ │ │ └── sntp#0.2.4
│ │ │ ├─┬ http-signature#0.10.0
│ │ │ │ ├── asn1#0.1.11
│ │ │ │ ├── assert-plus#0.1.2
│ │ │ │ └── ctype#0.5.2
│ │ │ ├── json-stringify-safe#5.0.0
│ │ │ ├── node-uuid#1.4.1
│ │ │ ├── oauth-sign#0.3.0
│ │ │ ├── qs#0.6.6
│ │ │ ├─┬ tough-cookie#0.12.1
│ │ │ │ └── punycode#1.2.4
│ │ │ └── tunnel-agent#0.3.0
│ │ └─┬ through2#0.4.1
│ │ ├─┬ readable-stream#1.0.27-1
│ │ │ ├── core-util-is#1.0.1
│ │ │ ├── inherits#2.0.1
│ │ │ ├── isarray#0.0.1
│ │ │ └── string_decoder#0.10.25-1
│ │ └─┬ xtend#2.1.2
│ │ └── object-keys#0.4.0
│ ├─┬ file-utils#0.1.5
│ │ ├── isbinaryfile#0.1.9
│ │ ├── lodash#2.1.0
│ │ └─┬ minimatch#0.2.14
│ │ ├── lru-cache#2.5.0
│ │ └── sigmund#1.0.0
│ ├── findup-sync#0.1.3
│ ├─┬ glob#3.2.9
│ │ ├── inherits#2.0.1
│ │ └─┬ minimatch#0.2.14
│ │ ├── lru-cache#2.5.0
│ │ └── sigmund#1.0.0
│ ├── iconv-lite#0.2.11
│ ├─┬ inquirer#0.4.1
│ │ ├─┬ cli-color#0.2.3
│ │ │ ├── es5-ext#0.9.2
│ │ │ └─┬ memoizee#0.2.6
│ │ │ ├── event-emitter#0.2.2
│ │ │ └── next-tick#0.1.0
│ │ ├── mute-stream#0.0.4
│ │ ├── readline2#0.1.0
│ │ └── through#2.3.4
│ ├── isbinaryfile#2.0.1
│ ├── lodash#2.4.1
│ ├── mime#1.2.11
│ ├── mkdirp#0.3.5
...
Can't actually post it all - this question has gotten very long, haha.
So I guess I could go through and make sure all of them are the same...but does anyone know which ones would be most important for the problem I am having?
Jeepers, that would be annoying!
I have been working on getting my site to work on openshift for a few days now. I spent the last day or two making sure that all of the npm package versions that I use on my computer are the same as the versions that are used on openshift. After I synced up all the versions, it was a lot of work to re-factor my code, but I eventually got it working.
The major error I had to figure out was that when I was trying to do a PUT request, even thought I wasn't changing the _id field - it would give me this error:
MongoError: Mod on _id not allowed
I eventually realized that I needed to create an object with all the same info, just without the _id field to get the update to work.
Other than that, it just took a lot of tinkering to get it right - here is the result of my labor - http://hackabox-eamonbenproject.rhcloud.com/ - the problem I have been having pertains to the forum I was making, so check that out - it is fully functional.
I am trying to execute a sample script that reads a CSV file. I copied the sample from this page:
http://www.adaltas.com/projects/node-csv/
I get this error:
csv()
^
TypeError: object is not a function
at Object.<anonymous> (/Users/paulchernoch/Documents/Chris Leung/read-csv-test.js:8:1)
at Module._compile (module.js:456:26)
at Object.Module._extensions..js (module.js:474:10)
at Module.load (module.js:356:32)
at Function.Module._load (module.js:312:12)
at Function.Module.runMain (module.js:497:10)
at startup (node.js:119:16)
at node.js:906:3
The sample code (modified to use my file names):
var csv = require('csv');
var fs = require('fs');
csv()
.from.stream(fs.createReadStream(__dirname+'/f1dcca4e8c5f76b3.csv'))
.to.path(__dirname+'/test.txt')
.transform( function(row){
return row;
})
.on('record', function(row,index){
console.log('#'+index+' ' /* +JSON.stringify(row) */);
})
.on('end', function(count){
console.log('Number of lines: '+count);
})
.on('error', function(error){
console.log(error.message);
});
I invoked the script from the command line like this:
> node read-csv-test.js
To verify whether I had the proper CSV module installed, I used the node package manager:
$ npm list
/Users/paulchernoch
├─┬ csv#0.4.0
│ ├── csv-generate#0.0.4
│ ├── csv-parse#0.0.3
│ ├── csv-stringify#0.0.2
│ └── stream-transform#0.0.2
├─┬ express#4.3.0
│ ├─┬ accepts#1.0.1
│ │ ├── mime#1.2.11
│ │ └── negotiator#0.4.3
│ ├── buffer-crc32#0.2.1
│ ├── cookie#0.1.2
│ ├── cookie-signature#1.0.3
│ ├── debug#0.8.1
│ ├── escape-html#1.0.1
│ ├── fresh#0.2.2
│ ├── merge-descriptors#0.0.2
│ ├── methods#1.0.0
│ ├── parseurl#1.0.1
│ ├── path-to-regexp#0.1.2
│ ├─┬ proxy-addr#1.0.0
│ │ └── ipaddr.js#0.1.2
│ ├── qs#0.6.6
│ ├── range-parser#1.0.0
│ ├─┬ send#0.3.0
│ │ ├── debug#0.8.0
│ │ └── mime#1.2.11
│ ├── serve-static#1.1.0
│ ├─┬ type-is#1.2.0
│ │ └── mime#1.2.11
│ └── utils-merge#1.0.0
├─┬ jade#1.3.1
│ ├── character-parser#1.2.0
│ ├── commander#2.1.0
│ ├─┬ constantinople#2.0.0
│ │ └─┬ uglify-js#2.4.13
│ │ ├── async#0.2.10
│ │ ├─┬ optimist#0.3.7
│ │ │ └── wordwrap#0.0.2
│ │ ├─┬ source-map#0.1.33
│ │ │ └── amdefine#0.1.0
│ │ └── uglify-to-browserify#1.0.2
│ ├── mkdirp#0.3.5
│ ├─┬ monocle#1.1.51
│ │ └─┬ readdirp#0.2.5
│ │ └─┬ minimatch#0.3.0
│ │ ├── lru-cache#2.5.0
│ │ └── sigmund#1.0.0
│ ├─┬ transformers#2.1.0
│ │ ├─┬ css#1.0.8
│ │ │ ├── css-parse#1.0.4
│ │ │ └── css-stringify#1.0.5
│ │ ├─┬ promise#2.0.0
│ │ │ └── is-promise#1.0.1
│ │ └─┬ uglify-js#2.2.5
│ │ ├─┬ optimist#0.3.7
│ │ │ └── wordwrap#0.0.2
│ │ └─┬ source-map#0.1.33
│ │ └── amdefine#0.1.0
│ └─┬ with#3.0.0
│ └─┬ uglify-js#2.4.13
│ ├── async#0.2.10
│ ├─┬ optimist#0.3.7
│ │ └── wordwrap#0.0.2
│ ├─┬ source-map#0.1.33
│ │ └── amdefine#0.1.0
│ └── uglify-to-browserify#1.0.2
├─┬ mariasql#0.1.20
│ └── lru-cache#2.3.1
└─┬ stylus#0.45.1
├── css-parse#1.7.0
├── debug#0.8.1
├─┬ glob#3.2.11
│ ├── inherits#2.0.1
│ └─┬ minimatch#0.3.0
│ ├── lru-cache#2.5.0
│ └── sigmund#1.0.0
├── mkdirp#0.3.5
└── sax#0.5.8
What am I missing? I am running MAC OS X 10.6.8. I installed node using Homebrew. I have successfully used node and javascript on Windows, but this is my very first attempt to use node on a MAC. (The ultimate goal is to parse CSV files and load them into MariaDb.)
Its not clear where you got your sample code, but it is probably no longer valid - a new version of the module (0.4) was released recently with a very different API. You can either check out the new documentation at the project's GitHub page or install an older version by:
npm remove csv
npm install csv#0.3.7
0.3.7 has the API you appear to be working against, but you can of course go farther back if necessary.