I have just build my first npm package. It is a small utility for helping me manage logins on hobby projects.
In v0.0.2 of this package I had an import that looked like this:
import { setRoute } from 'actions/route-actions';
Which did not work so i changed it to this
import { setRoute } from 'auth-hub-module/lib/actions/route-actions';
However when I try to install the new version (0.0.4) in my other projects I keep getting the import from version 0.0.2.
Why is this? How Can I debug this?
My build script works fine when I am in the package repo and the files being built there has the correct path.
I tried uninstalling and reinstalling the package in the project with no luck.
Related
So, I'm making a small chat tool using react-chat-elements as UI library for chat components. I'd like to modify certain CSS values to match what I want to build without being tied to that specific library the way it is now (it hasn't been updated since 5 months ago).
So what I tried is fork it to my Github account, created the NPM package from it (react-chat-elements-av) without making any changes first to make sure it worked the same way as with the original. However, when I import a specific component from the NPM package I created, say import { MessageBox, SystemMessage } from "react-chat-elements-av";, I get an error saying Attempted import error: 'MessageBox' is not exported from 'react-chat-elements-av'., being the attempted import location: /node_modules/react-chat-elements-av/index.
Now, if I import those two components from the original NPM package, import { MessageBox, SystemMessage } from "react-chat-elements";, everything works and the import location is a bit different: /node_modules/react-chat-elements/dist/main.
Is there something I'm missing on the creation of that dist directory when doing npm install react-chat-elements-av? I literally forked the original repo, and created the NPM package with it, no changes made to any webpack config or so.
Any idea what could be happening here?
Thanks in advance!
The dist repository is for production grade code after it has been built. It's the distribution file. try seeing how they have built their library by running npm run build once you've downloaded it.
I fetched this kind of error in my react project Can not find module 'react-dev-utils/clearConsole' . React version of my project is 16.2. Actually when I install prop-types with npm then I fetched this error and my project was stopped. I can not run my project again. What is the solution for this?
It looks like you lack some dependencies. In this particular example it is react-dev-utils.
Simple npm install --save-dev react-dev-utils should do.
I'm trying install react-vis-force module but not working properly.
I edited package.json to install 'react-vis-force' vs 0.3.1
But I met error.
Cannot find module './factoryWithTypeCheckers' from node_modules/react-vis-force/dist
How can I fix this?
Based on a solution found in the issues section of another react library, you can resolve this issue by changing the import statement.
import {ForceGraph, ForceGraphNode, ForceGraphLink} from 'react-vis-force/dist/react-vis-force.min.js';
The un-minified version of the code has a missing dependency- the minified version does not. It appears as though npm was using the un-minified version by default.
If you're working with npm try to do it
npm install --save react-vis-force
With --save you save your dependency in package.json
If you have do it before, try npm install for reinstall your dependencies.
We've started to build an application and came to decide we want to integrate it with office-ui-fabric-react. I know how to install packages using npm ..., I just have no idea where to install both NodeJs & gulp.
I have a repository called Relationize, in that repository I have a folder to my Api and to my web application(here is also my package-lock.json located).
In here I don't know if it should either be in the root where my project file is or in my wwwroot (as said it should be in your root). But when I ran all 3 commands: npm i -S nodejs, npm install --global gulp-cli and eventually npm --save install office-ui-fabric-react to install the office package.
When I try to add a component in a seperate javascript file to just test if it works(just copied the code from #Microsoft:
import * as React from 'react';
import * as ReactDOM from 'react-dom';
import { Fabric } from 'office-ui-fabric-react/lib/Fabric';
import { DefaultButton } from 'office-ui-fabric-react/lib/Button';
const MyPage = () => (<Fabric><DefaultButton>I am a button.</DefaultButton></Fabric>);
ReactDOM.render(<MyPage />, document.body.firstChild);
It gives an error:
Uncaught SyntaxError: Unexpected token import
Does anyone have an understandable guide on how to implement this in an existing project or someone who wants to spend some time helping me to implement it?
Thanks in advance!
Perhaps you are missing the ecosystem of build tools to transform your js file into something that is understood by your browser e.g. babel, webpack and the like? It's possible that your browser understands the latest module syntax though...
There is a good example program at: https://medium.com/#gmonne/simple-app-layout-with-office-ui-fabric-react-2eac6361e1b4. There are other examples.
I'm using meteor. I'd like to use redux-undo to develope
I have installed like this
meteor npm install redux-undo
And use
import undoable, { ActionCreators } from 'redux-undo';
The meteor always shows this errors
Cannot find module 'redux-undo'
However, I install the redux module and import as above, it works well. :(
Some one help me, thanks so much!