无法使用webpack加载模块(找不到模块:错误)

时间:2017-06-30 01:53:12

标签: javascript ruby-on-rails reactjs webpack babel

我正在尝试在Ruby on Rails应用上构建react组件。我将webpack环境放在/client中,并将捆绑的文件放入/app/assets/javascripts/webpack/。但是,当我启动webpack并尝试构建组件时,它会显示Module not found: Error: Cannot resolve 'file' or 'directory' /components/favorite_box。以下是我的代码。请教我什么问题。

目录

client
├─ src
│   ├ components
│   │    └─ favorite_box.js.jsx
│   └─index.js
├─ node_modules
├─ package.json
└─ webpack.config.js

文件组件

favorite_box.js.jsx

import React from 'react'
import ReactDOM from 'react-dom'

export default class FavoriteBox extends React.Component {
 // ...

  render() {
    return (
      <div className="FavoriteBox">
      </div>
    )
  }
}

index.js

import React from 'react'
import ReactDOM from 'react-dom'

import FavoriteBox from './components/favorite_box.js.jsx'

ReactDOM.render(
  <FavoriteBox/>,
  document.getElementById('favorite_box')
)

webpack.config.js

module.exports = {
  entry: {
    app: './src/index.js',
  },

  output: {
    path: '../app/assets/javascripts/webpack',
    filename: '[name].js',
  },

  module: {
    loaders: [
      { test: /\.(js|jsx)$/,
        loader: "babel",
        exclude: /node_modules/,
        query: {
          presets: ["es2015", "react"],
        }
      },
    ]
  },
}

的package.json

{
  "private": true,
  "scripts": {
    "webpack-watch": "webpack -w",
    "webpack-build": "webpack -p"
  },
  "devDependencies": {
    "babel-core": "^6.25.0",
    "babel-loader": "^6.2.4",
    "babel-preset-es2015": "^6.9.0",
    "babel-preset-react": "^6.11.1",
    "webpack": "^1.13.1"
  },
  "dependencies": {
    "react": "^15.2.1",
    "react-dom": "^15.2.1"
  }
}

0 个答案:

没有答案