web-dev-qa-db-ja.com

Webパックとのnpmリンク-モジュールが見つかりません

バンドラーとしてwebpackを使用して、モジュールをプロジェクトにnpmリンクしようとしています。もちろん、多くのことを試した後、私はこのエラーを出し続けます：

ERROR in ./src/components/store/TableView.jsx
Module not found: Error: Cannot resolve module 'react-bootstrap-table'

これを行うときに実行する正確な手順は次のとおりです。

1.) cd ../forks/react-bootstrap-table
2.) npm link
(success, checked ~/.nvm/.../node_modules/react-bootstrap-table for symlink and it's there)
3.) cd ../../projRoot/
4.) npm link react-bootstrap-table
(no errors thrown?, says successful link)
5.) node ./node_modules/webpack-dev-server/bin/webpack-dev-server.js

私が試したソリューション：
- https://webpack.github.io/docs/troubleshooting.html
- リンクされたコンポーネントのpeerDepdenciesに、リンクされているスクリプトの同等のnode_modulesを使用させる方法
-そしてGoogle Serps上の多くの紫色のリンク

webpack.config.js

const webpack = require('webpack')
const path = require('path')
const ROOT_PATH = path.resolve(__dirname)

module.exports = {
  devtool: process.env.NODE_ENV === 'production' ? '' : 'source-map',
  entry: [
    'webpack/hot/only-dev-server',
    './src/index.js'
  ],
  module: {
    loaders: [{
      test: /\.jsx?$/,
      exclude: /node_modules/,
      loaders: ['react-hot','babel']
    },
    {
      test: /\.scss$/,
      loaders: ['style','css','sass'],
      exclude: /node_modules/
    },
    {
      test: /\.css$/,
      loaders: ['style','css']
    },
    {
      test: /\.(ttf|eot|svg|woff(2)?)(\?[a-z0-9]+)?$/,
      loader: 'file-loader'
    }
    ]
  },
  resolve: {
    extensions: ['', '.js', '.jsx'],
    fallback: path.resolve(__dirname, './node_modules')
  },
  resolveLoader: {
    fallback: path.resolve(__dirname, './node_modules')
  },
  output: {
    path: process.env.NODE_ENV === 'production' ? path.resolve(ROOT_PATH, 'app/dist') : path.resolve(ROOT_PATH, 'app/build'),
    publicPath: '/',
    filename: 'bundle.js'
  },
  devServer: {
    contentBase: path.resolve(ROOT_PATH),
    historyApiFallback: true,
    hot: true,
    inline: true,
    progress: true,
    stats: 'errors-only',
    Host: '192.168.1.115'
  },
  plugins: [
    new webpack.HotModuleReplacementPlugin()
  ]
}

注：
1。これはプロジェクトの唯一のシンボリックリンクです
2。私はフォークされたバージョンの中でnpm installを実行します（これも試さずに動作しません）
3。私はNVMを使用していますが、以前はwebpackなしでシンボリックリンクを使用していました。

私はここに数日間ここにいます、どんな助けでも大いに感謝されます。

javascriptnode.jsnpmwebpacknvm
16
bmills

わかりました、これは私のユースケースに固有のものですが、シンボリックリンクしているライブラリを完全にビルドするために、すべての指示に従ってください。最初は、npmのインストールとgulpのビルドを行いましたが、それだけでは不十分でした。ライブラリを完全にビルドするには、いくつかの追加コマンドを実行する必要がありました。

今ではうまくいきます！それでも問題が解決しない場合は、シンボリックリンクしている各ライブラリのドキュメントを読み、外部ライブラリを解決するためのテンプレートとして私のwebpack設定を使用します。

0
bmills

私はwebpackで同様の問題に直面しており、これをwebpack.config.js：

module.exports = {
    resolve: {
        symlinks: false
    }
};

これが webpack docs へのリンクです。あなたの質問はwebpackとそのapiに多く発生したため、私の質問に対する私の回答の関連性がどの程度かはわかりません。しかし、今日またはこれと同様の問題に直面している人々にとって、これは解決策になる可能性があります。見られるように、まだ不満を言う人がいます：

5
Beat

また、バンドルと糸がインストールされ、リンクされたパッケージで実行されていることを確認してください

1
behraaang