代码之家  ›  专栏  ›  技术社区  ›  Rahul

webpack3:您可能需要适当的加载程序来处理此文件

  •  -1
  • Rahul  · 技术社区  · 7 年前

    我想我错过了什么 webpack.config.js

     ERROR in ./entry.js
    Module parse failed: /home/rahul/project/src/entry.js Unexpected token (9:2)
    

    您可能需要适当的加载程序来处理此文件

    | 
    | ReactDOM.render(
    |   <Router history={browserHistory}>
    |       <Route path="/register" component={Reg}>
    |         <IndexRoute component={Home}/>
    

    包裹json

    {
    "name": "project",
    "version": "1.0.0",
    "description": "React with node and express",
    "main": "entry.js",
    "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1",
    "start": "node server.js"
    },
    "author": "Rahul singh mawari",
    "license": "MIT",
    "dependencies": {
    "babel": "^6.23.0",
    "babel-cli": "^6.26.0",
    "babel-core": "^6.26.0",
    "babel-preset-es2015": "^6.24.1",
    "babel-preset-react": "^6.24.1",
    "express": "^4.16.2",
    "react": "^16.0.0",
    "react-dom": "^16.0.0",
    "react-router": "^4.2.0"
    },
    "devDependencies": {
    "babel-loader": "^7.1.2",
    "http-server": "^0.10.0",
    "webpack": "^3.7.1"
    }
    }
    

    网页包。配置。js公司

    var webpack = require('webpack');
    var path = require('path');
    
    
    var config = { 
    entry: path.join(__dirname,'src', 'entry.js'),
    output: {
        path: path.join(__dirname,'src', 'static'),
    filename: 'bundle.js',
    },
    
    module: {
    rules: [
            {
                test: /\.js?$/, 
                exclude:/node_modules/,
                use: ["babel-loader"],
                query: {
    presets: ['es2015', 'react']
    }
    }
    ]
    }
    };
    module.exports = config;
    

    import react from 'react';
    import Reg from './components/register';
    import Home from './components/home'; 
    import ReactDOM from 'react-dom'; 
    import { Router, Route, Link, browserHistory, IndexRoute } from 
    'react-router';
    
    
    ReactDOM.render(
    <Router history={browserHistory}>
      <Route path="/register" component={Reg}>
        <IndexRoute component={Home}/>
       </Route>
      </Router>,
    document.getElementById('app')
    );
    
    1 回复  |  直到 7 年前
        1
  •  1
  •   kemotoe    7 年前

    在你的网页中。配置。js尝试切换

    use: ["babel-loader"],
    

    loader: "babel-loader",
    

    作为 Webpack 2 migration tutorial 也就是说 use loader 当我们需要一系列装载机时,我们必须使用 使用 ,如果只是一个加载器,我们必须使用 装载机 :