• home > tools > Bundler > webpack >

    webpack4.x 与react-router2.x冲突,报错

    Author:zhoulujun@live.cn Date:

    webpack4 x router 回退到 "react-router ": "^2 8 1 ",发现报错,func 啥的,项目无法跑通

    react-router v4 组件化思想,蛮好。但是升级后,发现,整个路由都要改

    code split的 官方推荐模式:

    Babel (e.g., to compile JSX to JavaScript) then you will need to use the @babel/plugin-syntax-dynamic-import plugin. This is a syntax-only plugin, meaning Babel won’t do any additional transformations. The plugin simply allows Babel to parse dynamic imports so webpack can bundle them as a code split. Your .babelrc should look something like this:{
      "presets": ["@babel/react"],
      "plugins": ["@babel/plugin-syntax-dynamic-import"]
    }
    react-loadable is a higher-order component for loading components with dynamic imports. It handles all sorts of edge cases automatically and makes code splitting simple! Here’s an example of how to use react-loadable:import Loadable from "react-loadable";
    import Loading from "./Loading";
    
    const LoadableComponent = Loadable({
      loader: () => import("./Dashboard"),
      loading: Loading
    });
    
    export default class LoadableDashboard extends React.Component {
      render() {
        return <LoadableComponent />;
      }
    }

    改造成本还是太大,所以,还是回退到"react-router": "^2.8.1",发现报错,func 啥的。



    转载本站文章《webpack4.x 与react-router2.x冲突,报错》,
    请注明出处:https://www.zhoulujun.cn/html/tools/Bundler/webpack/2016_0217_6289.html