How to import React Components as a package / module from some other (non-project) directory?

Question

I have a couple of React Components in a folder that is not a reaction project. The directory structure for which I follow the following components:

~/components/Component1/index.jsx

~/components/Component2/index.jsx

Now I have a React project (built using create-react-app) called "myapp". I want to import those React Components as a package or module into my project.

I tried to mention the dependency in mine package.json, but it gives an error because I can not specify the absolute paths in package.json.

I do not want to publish these components as an npm package.

Please help me with this.

Answer 1

, , , ?

Answer 2

, , , - . , .

:

- ui, iconButton, iconMenu .., . git, , . , , . , , npm.js.

[ thr ptoblem.]

, , , . .

• -
• -
• -
• babel-preset-es2015
• babel-preset-react
• babel-preset-stage-2
• html-webpack-plugin
• raw-loader
• webpack
• WebPack-DEV-

devDependencies

• -
• -ui []

[ ] webpack.config.js script:

const path = require('path')
const webpack = require('webpack')

module.exports = {
  devtool: 'cheap-eval-source-map',
  entry: './docs/entry.js',
  output: {
    path: path.join(__dirname, 'dist'),
    filename: 'bundle.js'
  },
  resolve: {
    alias: {
      genericcomponents: path.join(__dirname, 'src')
    }
  },
  module: {
    loaders: [
      {
        test: /\.jsx?$/,
        exclude: /node_modules/,
        loader: 'babel-loader',
      }
    ]
  },
  devServer: {
    contentBase: 'docs/'
  }
}

, devtool , , . , .

, .

jsx, JSX.

, index.html entry.js.

:

App.jsx docs. , .

, .