React框架新闻网站学习过程中遇到的错误总结

1.安装指定版本插件命令

 npm install 插件名字@1.1.4(版本号) --save 或 yarn add 插件名字@1.1.4(版本号) --dev

2.Error:‘Link’ is not exported from 'react-route'

解决:‘react-router’4.0*之后的版本可以引用‘react-router-dom’代替‘react-router’

3.关于react-router中<Link>的调试   Error : You should not use <Link> outside a <Router>

解决方法:在Link外加一层<BrowserRouter></BrowserRouter>

4.Error: Plugin/Preset files are not allowed to export objects,webpack报错/babel报错的解决方法

解决方法: babel版本不统一,把babel所有插件统一改成6.0或7.0版本即可

5.Module build faild:TypeError: fileSystem.statSync is not a function

解决方法:babel-loader是7.0版本而webpack是1.15.0版本,二者不兼容,把babel-loader改成6.4.1版本

6. Uncaught TypeError : Cannot  read property 'uniquekey' of undefined(这个问题困扰了我好几天好气!!!)

react-router4.*以上版本对2.*版本中的 this.props.params.uniquekey用法做了改动,改成this.props.match.params.uniquekey问题就解决了!!!

7. Error: Webpack has been initialised using a configuration object that does not match the API schema.- configuration.module has an unknown property 'loaders'. These properties are valid:object { defaultRules?, exprContextCritical?, exprContextRecursive?, exprContextRegExp?, exprContextRequest?, noParse?, rules?, strictExportPresence?,     strictThisContextOnImports?, unknownContextCritical?, unknownContextRecursive?, unknownContextRegExp?, unknownContextRequest?, unsafeCache?, wrapped ContextCritical?, wrappedContextRecursive?, wrappedContextRegExp? } -> Options affecting the normal modules (`NormalModuleFactory`).

解决方法:webpack.config.js文件里的  module{loaders:[......]} 改为  module{rules:[......]}

8. React-router版本5.0.0,移动端开发<Link>页面跳转时url会发生变化,但是页面不跳转,手动刷新页面才会正常跳转

解决方法:<link>标签里没有target=“_blank”属性时,Link标签外要用<Route>包裹而不是<BrowserRouter>

9. React-router 4.*以上版本route文件中,一个<BrowserRouter>下只能有一个Route,如果想放多个需要在<Route>外整体加<Switch>,代码示例如下

                    <BrowserRouter >
                        <Switch>
                            <Route exact path="/" component={PCIndex}></Route>
                            <Route path="/details/:uniquekey" component={PCNewsDetails}></Route>
                            <Route path="/usercenter" component={PCUserCenter}></Route>
                        </Switch>
                    </BrowserRouter>

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值