首页 文章

Webpack无法解析React组件

提问于
浏览
2

当我的反应应用程序运行我的webpack dev服务器时,我得到一个“未找到模块:错误:无法解析'/ Users / willhamilton / Desktop / freeva / src中的'/ components / FrontPage'错误 . 我实现了反应路由器后才会弹出此错误 .

Index.js

const path = require('path');
import FrontPage from '/components/FrontPage';
import Political from '/components/Political';
import Login from '/components/Login'
import BrowserRouter from 'react-router-dom';
import Route from 'react-router-dom';
const React =  require("react");
const ReactDOM = require("react-dom");

ReactDOM.render(
    <BrowserRouter>
        <div>
            <Route path='/' component={FrontPage} />
            <Route path='/political' component={Political} />
            <Route path='/login' component={Login} />
        </div>
    </BrowserRouter>,
    document.getElementById('root'));

webpack.config.js

const path = require('path');
const webpack = require('webpack');
const HtmlWebPackPlugin = require("html-webpack-plugin");

const htmlPlugin = new HtmlWebPackPlugin({
    template: "./public/index.html",
    filename: "./index.html"
});

module.exports = {
    module: {
        rules: [
            {
                test: /\.js$/,
                exclude: /node_modules/,
                use: {
                    loader: "babel-loader"
                }
            },

            {
                test: /\.css$/,
                use: ["style-loader", "css-loader"]
            }
        ]
    },
    plugins: [htmlPlugin],
    devServer: {
        port: 3000
    }
};

关于可能导致此问题/如何解决问题的任何想法? (路径是正确的)

1 回答

  • 0

    使用 ./ 来引用当前目录:

    import FrontPage from './components/FrontPage';
    import Political from './components/Political';
    import Login from './components/Login'
    

相关问题