Repository navigation
Importing components from another package #3689
Description
Hello folks!
I'm trying to make kind of living style guide and common components. That will be used in more projects.
I am using create-react-app and storybook. Development works well.
Then I npm install git+ssh://git@... repo into my actual project.
Problem appears when I try to import a component from that style guide. I get
/home/andrewluca/Projects/style-patterns/src/components/Footer.js
Module parse failed: Unexpected token (4:2)
You may need an appropriate loader to handle this file type.
|
| const Footer = () => (
| <footer className="footer">
| <div className="container">
| <div>
If i'm importing a simple function from my package, that does not use react, it works.
I added react and react-dom as peer and dev dependencies so I can do development and use version of react from my project.
My components are not compiled to any cjs es umd
⇒ nodejs -v
v8.9.4
⇒ npm -v
5.6.0
style-patterns/package.json deps
"dependencies": {
"prop-types": "^15.6.0"
},
"peerDependencies": {
"bootstrap": "4.0.0-beta.3",
"react": "^16.2.0",
"react-dom": "^16.2.0"
},
"devDependencies": {
"@storybook/react": "^3.3.3",
"babel-core": "^6.26.0",
"bootstrap": "4.0.0-beta.3",
"react": "^16.2.0",
"react-dom": "^16.2.0",
"reactstrap": "^5.0.0-alpha.4"
}
my-project/package.json deps
"dependencies": {
"style-patterns": "git+ssh://git@...",
"react": "^16.2.0",
"react-dom": "^16.2.0",
"react-scripts": "1.0.17"
},
Does anyone meet this problem?
Activity
unrevised6419 commentedon Jan 4, 2018
It seems to be related to #3547
unrevised6419 commentedon Jan 5, 2018
After 7 hours of reading a lot of issues, and docs.
I come to this. Put all project in same repo,
style-patternsmy-project1my-project2my-project3Make 3 symlinks of
style-patternsinto all project assrc/commonEject all 3 projects and change webpack configs:
I got the error because babel ignores
node_modules, webpack was right, no loader for jsx...I added symlinks in
srcbecausecreate-react-appdoes not allow sources outside this folderps:
npm linkis so broken?unrevised6419 commentedon Jan 5, 2018
Or I still can keep them separate in different repos.
And make symlinks from
node_modules/style-patterns.Using
npm/yarn linkfor development is working.unrevised6419 commentedon Jan 5, 2018
Why
resolve.symlinksis not set tofalsein CRA configs?gaearon commentedon Jan 9, 2018
We just don't have a good story around symlinks right now. I don't think what you're describing was/is currently supported.
gaearon commentedon Jan 9, 2018
I'll close as a duplicate of #3547.
unrevised6419 commentedon Jan 16, 2018
#3695
nimahkh commentedon Sep 9, 2018
this is old question , but you can use this repository : http://github.com/nimahkh/react-all-in-one-package it helps me