问题
So I am trying to build an Open Source project using react and pushing it to npm. The issue is, my components, while they work great on a test environment - mounted to other components but when I publish it to npm and download the package and try to access it, it gives me an error.
Here is a small sample of the code
import React, {Component} from 'react';
import {Nav, NavBar, NavLink, NavItem} from 'react-bootstrap';
class GitNav extends Component{
handleSelect(eventKey){
window.location = this.props.NavURLs[eventKey];
}
render(props){
const NavTextItems = this.props.NavTexts.map((eachNav, key) =>
<NavItem eventKey={key} href="#">{eachNav}</NavItem>
);
return(
<Navbar fixedBottom collapseOnSelect>
<Navbar.Header>
<Navbar.Toggle />
</Navbar.Header>
<Navbar.Collapse>
<Nav onSelect={this.handleSelect.bind(this)}>
{NavTextItems}
</Nav>
</Navbar.Collapse>
</Navbar>
);
}
}
export default GitNav;
Here is the error:
Error in ./~/react-github-nav/index.js
Module parse failed: /Users/theawesomeguy/Desktop/Projects/resume3/resume/node_modules/react-github-nav/index.js Unexpected token (11:6)
You may need an appropriate loader to handle this file type.
SyntaxError: Unexpected token (11:6)
@ ./src/App.js 20:22-49
If anyone can help me out with this, that will be great. Thanks in advance!
回答1:
In order to push react libraries into NPM, you may need some boilerplate which will install and convert many things for you.
=====
I've also pushed several react libraries successfully into NPM:
https://www.npmjs.com/~thinhvo0108
https://www.npmjs.com/package/react-sticky-dynamic-header
https://www.npmjs.com/package/react-ringing-bell
=====
Your github repositories' folder structure should also look like mine:
https://github.com/thinhvo0108/react-sticky-dynamic-header
https://github.com/thinhvo0108/react-ringing-bell
=====
Useful tutorial below here:
(boilerplate source) https://github.com/juliancwirko/react-npm-boilerplate
(author's article) http://julian.io/creating-react-npm-packages-with-es2015/
来源:https://stackoverflow.com/questions/43626034/issue-with-publishing-to-npm