利用 React/Redux/React-Router 4/webpack 开发大型 web 项目时如何按需加载
- 如何设计一个大型 web 项目?
- React + webpack 如何按需加载?
- React + React-Router 4 + webpack 如何按需加载?
- React + Redux + React-Router 4 + webpack 如何按需加载?
实录提要:
- bundle-loader 和 Webpack 内置的 import() 有什么区别?
- 按需加载能否支持通过请求后台数据,动态配置页面的的应用场景?
- 参与过几个 React 项目,被依赖包搞的晕晕的,不知道该怎么选择?
- 什么包应该放到 devDependencies 里面?什么包放到 depedencies 里面?
- 为什么是 react-router-redux 而不是传统的 react-redux,其优势是什么?
- 按需加载时,每个单独的 bundle 都挺大的,为什么?
- ECMAScript 每年出一个版本,对应的 babel 也有一大堆,应该如何选择?
- 单页项目过大,怎么拆分不同模块页面到不同 js 来动态加载?
题外话
经验尚浅,尚不足以教导,若理解有误,望能指导三分,语言若有偏激,请理解我年轻气盛。
之所以写这篇文章,是因为我最近一阵子经历了一个部门的技术选型->项目实施这些技术->二次技术选型->技术版本升级的一个过程。开发业务应用为主的我们,很少有时间去研究某项技术的源码,不加班赶项目进度就已经很庆幸了,大部分时间都花在了如何灵活使用市面上的一些技术体系。在这篇文章中,不涉及源码范围,我也没去研究过源码。写这篇文章的初衷是分享我的想法和代码示例,同时也希望看这篇文章的你能够给予宝贵的意见,让我得以进步。
web应用让人惊叹是从Gmail开始的,流畅的桌面版体验吸引了很多人,从此web项目开始蓬勃发展。随后,web应用也越来越复杂,为了能让web应用如同桌面版应用一样流畅,出现了SPA。这就是今天我想说的,react/redux等等一系列的产品的出现都是为了实现体验度更佳的SPA。
两年前,我开发web项目,都只是用javaweb,使用模板引擎,后端渲染出页面。对于访问量不是很大、单个页面复杂度不是很高、项目的迭代周期不频繁、二次开发的次数很少的系统,这种模式无疑很适用、性能也没什么大的影响,一个java程序员就可以做到全栈。而事实上,我手头的web项目并非这么简单,随着周期的迭代,项目越来越臃肿,后端代码和前端代码掺杂在一起混乱不堪,当时我自认为自己技术不错,代码写的自己都认识,然而我离职之后发现一个很多人都知道的道理,一个技术真正好的程序员,写出来的代码是要能够让他人读的懂,最起码要让接替你继续这个项目的人读得懂,技术不行那是例外,当时我没有做到。而后,进入新的公司,让我能够有机会去对部门进行技术选型,主要是前端部分。我果断选择了前后端分离模式,我不想以前不好的地方继续发生在以后。人员安排最好是这样,专职的人做专职的事,全栈人员要能够补位。设计一个优质的web项目,最重要的是人,而不是技术!
设计web最好是前端设计成SPA、后端设计成微服务,有很多企业使用react、vue、angular这些,结果是多页应用,增加复杂度,降低页面切换的流畅度。我真不知道他们是怎么想的,首先多页应用是不可取的,如果他们是开发webapp,封装成apk,那就更不可取了!web项目设计成SPA,很多人会想,随着代码量的增大,首次加载的文件就会增大,没错,这时就需要用到code splitting。这也就是我今天要讲的实际项目中如何进行按需加载。我见过有些开发人员将一个js文件拆分成多个js文件,而每个页面都加载这些js文件,这显然是不可取的,这样子的不需要拆分。随着现在网速的提升,首次加载文件稍微大点都是可以接受的。首次加载后缓存在浏览器处,下次加载的时候会更快。引入第三方UI组件,基础组件要单一,不可以引入antd了再去引用bootstrap,还有用了react这些就不要在项目中出现jQuery,要纯粹!
废话就讲到这里,下面介绍我将一个项目重构三次的过程,这三个过程里有三种不同的按需加载方式。示例是我将实际项目删减过后可运行的例子。code splitting和react/react-router是没有直接关系的。
一、react(v.0.14.8) / react-router(v.1.0.3) / webpack(v.1.13.3)
兼容IE8+及现代浏览器,示例代码地址->https://github.com/love-fay/fay-webpack-redux-code-splitting/tree/master/react。
先贴下依赖:
因为业务的需求,需要兼容到IE8,不得不被动地选择低版本库。处于对react的首次使用,并没有加入redux相关技术。
在react-router 1.x版本中Route组件上拥有getComponent、onEnter参数(4.x之后被移除),getComponent是异步的,所以我们可以在这个参数里进行按需加载,getComponent这个函数有两个参数nextState、callback,根据nextState.pathname可以获取到路由地址,然后再利用webpack的require.ensure异步加载所属组件的js文件,最后通过callback将该组件返回。示例代码如下:
<Route path="app" getComponent={this.getUumsComponent} onEnter={this.requireAuth}/>
getUumsComponent = (nextState, callback) ={ let pathname = nextState.pathname; switch (pathname) { case 'app': require.ensure([], (require) ={ callback(null, require('../app/components/App')); }, 'App'); break; default : historyConfig.pushState({nextPathname: pathname}, '/404'); }};
打包过后主要文件的对比:
code splitting
not code splitting
这种方式的按需加载就这些,很简单~
二、react(v.15.6.1) / react-router(v.4.2.2)b / webpack(v.3.5.6)
兼容IE9+及现代浏览器,示例代码地址->https://github.com/love-fay/fay-webpack-redux-code-splitting/tree/master/react-rr4。
先贴下依赖:
这次决定抛弃IE8,甚至都不想兼容IE。很多人口口声声说用户体验、用户需求,却一味地去支持IE8,甚至还有支持IE6的!其实用户体验和需求不是用户单方面的要求,还有就是开发方需要去改变用户习惯、引导用户对未来的需求,在这基础上不断地提高用户体验。(你不告知你的用户有个浏览器叫做谷歌浏览器,他这辈子就会觉得IE就是浏览器,浏览器就是IE。)
这次主要是将react/react-router/webpack进行了升级,并升级到最新(当时的最新)。
按需加载其实跟react-router没多大关系,只不过需要借助它更好的完成按需加载这项任务。react-router升级到4后,便没有了getComponent这个参数,所以我们得换种方式,react-router4官方示例也提供了code splitting的方法,利用webpack结合bundle-loader,它是在require.ensure基础上封装的,更友好的实现异步加载过程。
bundle-loader可以在webpack文件中进行配置,这里我就不介绍了,webpack官方文档都有写。我这里是写在代码里的。我简单说下,基本跟react-router4官方文档说的差不多。
首先先写一个bundle.js这个组件,代码如下:
import React, { Component } from 'react';import PropTypes from 'prop-types';class Bundle extends Component { static propTypes = { load: PropTypes.any, children: PropTypes.any, }; state = { mod: null, }; componentWillMount () { this.load(this.props); } componentWillReceiveProps (nextProps) { if (nextProps.load !== this.props.load) { this.load(nextProps); } } load (props) { this.setState({ mod: null, }); props.load((mod) ={ this.setState({ mod: mod['default'] ? mod['default'] : mod, }); }); } render () { return this.state.mod ? this.props.children(this.state.mod) : <div></div>; }}export default Bundle;
然后在用到需要按需加载的组件的组件中,引入的时候,在文件路径前面使用bundle-loader?lazy&name=[App]!,如下:
import loadApp from 'bundle-loader?lazy&name=[App]!../../app/components/App';
然后比如我这里使用 <Route path="/app" component={App}/>
加载这个App组件,我们需要用到刚才自己写的bundle组件:
import Bundle from '../bundle/components/Bundle';const App = (props) =( <Bundle load={loadApp}> {(App) ={ return <App {...props}/>; }} </Bundle>);
打包过后主要文件的对比:
code splitting
not code splitting
到这里,这第二种方式介绍完了,很简单~
二、react(v.16.1.1) / redux(v.3.7.2) / react-router(v.4.2.2) / webpack(v.3.8.1)
兼容IE9+及现代浏览器,示例代码地址->https://github.com/love-fay/fay-webpack-redux-code-splitting/tree/master/react-rr4-redux。
先贴下依赖:
这次又一次对引用的技术进行了更新,同时加入了redux,项目复杂度的提高,组件之间的交流变得复杂,此时就需要用到redux。有些开发人员会觉得好烦,不断地升级,不断地改造,很费时费力,什么时候才能稳定,其实不然,项目的稳定不代表技术的不变,稳定是相对的。如果想要一劳永逸的话,就不要让公司给你涨工资了,公司也想一劳永逸~以后人工智能一旦铺开到企业级开发中,将会导致大量在安逸中度过的程序员失业!学习是无止境的,学习也是人一辈子免费的技能,曾经后端Java一家独大的时候,spring3稳定的时候,很多后端程序员就开始陷入了一劳永逸的幻觉当中,导致他们中的很多人一度抱怨前端是在瞎折腾~这就好比有自行车为什么要造汽车的理论是一样的~我是以Java程序员入行的,很清楚Java写后端的时候,轮子很多,很多程序员就是使用CV大法,甚至很多项目经理啊什么的就说程序员是搬运工,代码不就是增删改查么~
使用了redux后,全局只有一个Store,而这个Store在页面打开的时候就已经声明了,于是让我很纠结如何按需加载。后来我了解到redux这个东西的存在,内部运用了react中的context,同时这个context算是隐藏着的秘密。利用它我可以改变全局的Store。我这里使用了react-redux,在顶级组件处加入。
import {Provider} from 'react-redux';<Provider store={store}> ......</Provider>
然后在需要引入store信息的子组件处利用它提供的connect方法将store派发下去,这里派发是根据上下文context。项目中少不了用到路由,这时候,我使用了react-router-redux(一定要5.x版本npm i react-router-redux@next
),在总的reducer中加入routerReducer,然后在写路由组件的部分的顶级处使用。
import createBrowserHistory from 'history/createBrowserHistory';import { ConnectedRouter} from 'react-router-redux';const history = createBrowserHistory();<ConnectedRouter history={history}> ......</ConnectedRouter>
让我们再回到上一个代码片,其中的store来源如下:
import configureStore from '../Store';let store = configureStore();
Store.js
import {createStore, applyMiddleware, compose} from 'redux';import { createLogger } from 'redux-logger';const logger = createLogger();import { routerMiddleware } from 'react-router-redux';import createHistory from 'history/createBrowserHistory';import createSagaMiddleware from 'redux-saga';const history = createHistory();const rMiddleware = routerMiddleware(history);const win = window;export const sagaMiddleware = createSagaMiddleware();const middlewares = [rMiddleware, sagaMiddleware];if (process.env.NODE_ENV !== 'production') { middlewares.push(require('redux-immutable-state-invariant').default());}const storeEnhancers = compose( applyMiddleware(...middlewares, logger), (win && win.devToolsExtension) ? win.devToolsExtension() : (f) =f,);import createReducer from './reducers';export function injectAsyncStore(store, asyncReducers, sagas) { asyncReducers && injectAsyncReducers(store, asyncReducers); sagas && injectAsyncSagas(store, sagas);}function injectAsyncReducers(store, asyncReducers) { let flag = false; for (let key in asyncReducers) { if(Object.prototype.hasOwnProperty.call(asyncReducers, key)) { if (!store.asyncReducers[key]) { store.asyncReducers[key] = asyncReducers[key]; flag = true; } } } flag && store.replaceReducer(createReducer(store.asyncReducers));}function injectAsyncSagas(store, sagas) { for (let key in sagas) { if(Object.prototype.hasOwnProperty.call(sagas, key)) { if (!store.asyncSagas[key]) { store.asyncSagas[key] = sagas[key]; store.sagaMiddleware.run(sagas[key]); } } }}export default function configureStore() { let store = createStore(createReducer(), {}, storeEnhancers); store.asyncReducers = {}; store.asyncSagas = {}; store.sagaMiddleware = sagaMiddleware; return store;}
reducers.js
import { combineReducers } from 'redux';import { routerReducer } from 'react-router-redux';export default function createReducer(asyncReducers) { const reducers = { ...asyncReducers, router: routerReducer }; return combineReducers(reducers);}
我没有进行删减,主要是动态改变store中两个东西,一个是reducer还有一个就是saga。异步请求这块我用的是redux-saga,虽然官方文档上露脸的是redux-thunk和redux-promise,但是后起之秀redux-saga做到低耦合,在项目中作为独立的一层出现,不与action creator和reducer耦合。还有就是它强大的异步流程控制。
再来看看路由部分是怎么写的:
<Provider store={store}> <ConnectedRouter history={history}> <Switch> <Route path='/app' component={App}/> </Switch> </ConnectedRouter></Provider>
这里的App组件便是我们要按需加载的组件。我是按照模块来组织我的代码的,先来看下App模块的代码排版:
这张图中sagas.js是用来处理异步请求的,bundle.js和lazy.js以及公用的bundle.js是用来完成code splitting的。
lazy.js【需要懒加载的文件】
import appSagas from './sagas';import appReducer from './reducer';import view from './views/app';const reducer = { appReducer: appReducer};const sagas = { appSagas: appSagas};export {sagas, reducer, view};
bundle.js【code splitting】
import React from 'react';import Bundle from '../../bundle/views/bundle';import load from 'bundle-loader?lazy&name=[App]!./bundle';import {injectAsyncStore} from '../../Store';export default (props) ={ return ( <Bundle load={(store, cb) ={ load((target) ={ const {reducer, view, sagas} = target; injectAsyncStore(store, reducer, sagas); cb(view); }) }}> {(View) ={ return <View {...props}/> }} </Bundle> );};
公用的bundle.js【对其进行了改造,加入了store】
import React, { Component } from 'react';import PropTypes from 'prop-types';class Bundle extends Component { static propTypes = { load: PropTypes.any, children: PropTypes.any, }; static contextTypes = { store: PropTypes.object }; state = { mod: null, }; componentWillMount () { this._isMounted = true; this.load(this.props); } componentWillUnmount() { this._isMounted = false; } componentWillReceiveProps (nextProps) { if (nextProps.load !== this.props.load) { this.load(nextProps); } } load (props) { this.setState({ mod: null, }); props.load(this.context.store, (mod) ={ if (this._isMounted) { this.setState({ mod: mod['default'] ? mod['default'] : mod, }); } }); } render () { return this.state.mod ? this.props.children(this.state.mod) : <div>组件加载中...</div>; }}export default Bundle;
index.js【对外暴露的组件】
import view from './bundle';export {view};
code splitting就完成了~当然我又进行了更改,下文有讲。
这里要说下公用的bundle.js中的this.context.store,这里一定要定义contextTypes,不然获取不到this.context,当然官方没有提供这个api,也不推荐使用,但是按需加载就得需要它,并且我们要谨慎使用它即可,因为this.context一旦改变,它关联的上下文就会重新render,所以加载某个页面的时候,把它所要使用到的reducer和sagas也都关联进去,这样加载这个页面其他组件的时候就已经存在相关的reducer和sagas,不需要再改变上下文的store了。还有组件设计很重要,如果不合理会导致页面不可控。lazy.js中的reducer和sagas是个对象,比如app这个组件中如果嵌套了其他组件,而这些其他组件中需要引入reducer和sagas,这时可以将这些reducer和sagas结合到app模块的lazy.js中。不加入也可以,这时需要灵活运用shouldComponentUpdate这个生命周期来控制页面。
从上面的代码中,可以发现每个模块的bundle.js中存在类似的代码,这样我们可以给其剥离出来,这不是必须的,因为剥离出来后,我们需要约定好每个模块lazy.js中必须是export {sagas, reducer, view},当然也可以约定其他,一致就行。这样代码进过改造后,每个模块的bundle.js代码就可以分离到公共的bundle.js和模块中的index.js中,代码如下。
bundle.js中改动的代码片:
load (props) { this.setState({ mod: null, }); props.load((mod) ={ const {reducer, view, sagas} = mod; injectAsyncStore(this.context.store, reducer, sagas); if (this._isMounted) { this.setState({ mod: view['default'] ? view['default'] : view, }); } });}
index.js【以app模块为例】
import React from 'react';import Bundle from '../../bundle/views/bundle';import load from 'bundle-loader?lazy&name=[App]!./lazy';const view = (props) ={ return ( <Bundle load={load}> {(View) ={ return <View {...props}/> }} </Bundle> );};export {view};
打包过后主要文件的对比:
code splitting
not code splitting
关于组件设计,使用reactjs的时候组件设计一定要足够的扁平化,也就是平级,这样不仅提高了计算的效率,同时也会很少出现父组件中嵌套子组件,而父组件更新的时候,子组件也跟着更新,实际上子组件并不想更新。当然遇到逼不得已嵌套的情况的时候,可以使用shouldComponentUpdate这个组件存在时期的生命周期来控制子组件是否render。可喜的是react16版本中B组件不嵌套在A组件中,渲染后出现在A组件里,也可以挂载到任何一个组件里,这就是portals。
看到这里,你会发现其实code splitting跟react和react-router没多大关系,直接的联系是redux和webpack,所以这种方式同时也适用于其他使用redux和webpack这种类似的技术体系。
react技术栈是目前前端最美的技术栈。
本文首发于GitChat,未经授权不得转载,转载需与GitChat联系。
阅读全文: http://gitbook.cn/gitchat/activity/5a0015e2d6f4ca0a7ab25690
您还可以下载 CSDN 旗下精品原创内容社区 GitChat App ,阅读更多 GitChat 专享技术内容哦。
如若内容造成侵权/违法违规/事实不符,请联系编程学习网邮箱:809451989@qq.com进行投诉反馈,一经查实,立即删除!
相关文章
- AngularJs、RequireJs、AngularAMD、ui-router搭建的JS文件动态加载
如今页面的复杂度极高,需要加载的脚本文件极多,降低了用户体验,所以写了这个动态加载脚本的demo,欢迎交流: 1. 主页:requireJs 入口:data-main"mian.js",如下:…...
2024/4/28 14:55:35 - 双眼皮 帖子
...
2024/4/21 16:37:33 - 双眼皮 术后 闭合不全
...
2024/4/21 16:37:34 - 双眼皮 肉条 肿 区别
...
2024/4/28 4:01:52 - angularJS之自定义指令
1. 自定义指令的创建和使用: 使用 .directive 函数来添加自定义的指令 自定义指令的名字采用驼峰命名法。 注意:在使用的时候以 “-” 分割如: runoob-directive <!DOCTYPE html> <html> <head> <meta charset"…...
2024/4/21 16:37:30 - AngularJs自定义指令实例
angular.module(‘myApp’, []) .directive(‘rnStepper’, function() { return { restrict: ‘AE’, template: ‘-’ ‘{{value}} ’ ‘‘, link: function(scope, iElement, iAttrs) { scope.value 0; scope.increment function() { scope.value; }; scope.decrement …...
2024/4/27 22:37:04 - 双眼皮 皮瓣成形术
...
2024/4/28 3:13:02 - 双眼皮 美瞳
...
2024/4/28 6:59:13 - 双眼皮 红蓝光
...
2024/4/28 8:44:22 - 双眼皮 不消肿
...
2024/4/20 14:19:26 - 手术双眼皮 半个月 不消肿
...
2024/4/20 14:19:25 - 手术双眼皮恢复过程图
...
2024/4/28 14:55:54 - 什么算手术可以加深双眼皮吗
...
2024/4/28 15:07:46 - 什么是双眼皮加深
...
2024/4/27 22:43:46 - 深圳找医生做什么叫什么是韩国微创什么是双眼皮动态切开
...
2024/4/28 3:06:31 - Angular 5 中的样式问题
用了别人写的指令,里面返回了html标签。傻傻的,在Angular 5的component中定义了样式,但是样式就是不起作用,不起作用有没有!那种无奈的感觉,chrome查看,居然是 user agent stylesheet 起作用…...
2024/4/28 7:38:59 - angular 2+ innerHTML属性中内联样式丢失
通过属性绑定的innerHTML,把字符串里面的html解析 解析是没问题的,但一些内联样式会丢失掉 为了不丢掉样式,需要自定义一个管道来解决这个问题 html.pipe.ts import {Pipe, PipeTransform} from "angular/core"; import {DomSaniti…...
2024/4/21 16:37:26 - 深圳双眼皮价格是多少钱啊
...
2024/4/21 16:37:25 - 深圳双眼皮价格多少
...
2024/4/24 14:49:17 - 深圳美莱修复深圳美莱做深圳哪里开深圳深圳双眼皮价格
...
2024/4/21 16:37:26
最新文章
- swiper使用方法?
组件 首先 recat -vant组件 带小点点的 可以实现跳转的一个效果 import { Swiper } from react-vant; 每个 Swiper.Item 代表一张轮播卡片,可以通过 autoplay 属性设置自动轮播的间隔。 import React from react; import { Swiper } from react-vant; import { i…...
2024/4/28 17:50:59 - 梯度消失和梯度爆炸的一些处理方法
在这里是记录一下梯度消失或梯度爆炸的一些处理技巧。全当学习总结了如有错误还请留言,在此感激不尽。 权重和梯度的更新公式如下: w w − η ⋅ ∇ w w w - \eta \cdot \nabla w ww−η⋅∇w 个人通俗的理解梯度消失就是网络模型在反向求导的时候出…...
2024/3/20 10:50:27 - 蓝桥杯加训
1.两只塔姆沃斯牛(模拟) 思路:人和牛都记录三个数据,当前坐标和走的方向,如果人和牛的坐标和方向走重复了,那就说明一直在绕圈圈,无解 #include<iostream> using namespace std; const i…...
2024/4/27 19:03:08 - WKWebView的使用
一、简介 在iOS中,WKWebView是WebKit框架提供的一个用于展示网页内容的控件,相比UIWebView有更好的性能和功能。 以下是在iOS中使用WKWebView的基本步骤: 1.1 导入WebKit框架 import WebKit1.2 创建WKWebView实例 let webView WKWebVie…...
2024/4/26 8:35:06 - 【外汇早评】美通胀数据走低,美元调整
原标题:【外汇早评】美通胀数据走低,美元调整昨日美国方面公布了新一期的核心PCE物价指数数据,同比增长1.6%,低于前值和预期值的1.7%,距离美联储的通胀目标2%继续走低,通胀压力较低,且此前美国一季度GDP初值中的消费部分下滑明显,因此市场对美联储后续更可能降息的政策…...
2024/4/28 13:52:11 - 【原油贵金属周评】原油多头拥挤,价格调整
原标题:【原油贵金属周评】原油多头拥挤,价格调整本周国际劳动节,我们喜迎四天假期,但是整个金融市场确实流动性充沛,大事频发,各个商品波动剧烈。美国方面,在本周四凌晨公布5月份的利率决议和新闻发布会,维持联邦基金利率在2.25%-2.50%不变,符合市场预期。同时美联储…...
2024/4/28 3:28:32 - 【外汇周评】靓丽非农不及疲软通胀影响
原标题:【外汇周评】靓丽非农不及疲软通胀影响在刚结束的周五,美国方面公布了新一期的非农就业数据,大幅好于前值和预期,新增就业重新回到20万以上。具体数据: 美国4月非农就业人口变动 26.3万人,预期 19万人,前值 19.6万人。 美国4月失业率 3.6%,预期 3.8%,前值 3…...
2024/4/26 23:05:52 - 【原油贵金属早评】库存继续增加,油价收跌
原标题:【原油贵金属早评】库存继续增加,油价收跌周三清晨公布美国当周API原油库存数据,上周原油库存增加281万桶至4.692亿桶,增幅超过预期的74.4万桶。且有消息人士称,沙特阿美据悉将于6月向亚洲炼油厂额外出售更多原油,印度炼油商预计将每日获得至多20万桶的额外原油供…...
2024/4/28 13:51:37 - 【外汇早评】日本央行会议纪要不改日元强势
原标题:【外汇早评】日本央行会议纪要不改日元强势近两日日元大幅走强与近期市场风险情绪上升,避险资金回流日元有关,也与前一段时间的美日贸易谈判给日本缓冲期,日本方面对汇率问题也避免继续贬值有关。虽然今日早间日本央行公布的利率会议纪要仍然是支持宽松政策,但这符…...
2024/4/27 17:58:04 - 【原油贵金属早评】欧佩克稳定市场,填补伊朗问题的影响
原标题:【原油贵金属早评】欧佩克稳定市场,填补伊朗问题的影响近日伊朗局势升温,导致市场担忧影响原油供给,油价试图反弹。此时OPEC表态稳定市场。据消息人士透露,沙特6月石油出口料将低于700万桶/日,沙特已经收到石油消费国提出的6月份扩大出口的“适度要求”,沙特将满…...
2024/4/27 14:22:49 - 【外汇早评】美欲与伊朗重谈协议
原标题:【外汇早评】美欲与伊朗重谈协议美国对伊朗的制裁遭到伊朗的抗议,昨日伊朗方面提出将部分退出伊核协议。而此行为又遭到欧洲方面对伊朗的谴责和警告,伊朗外长昨日回应称,欧洲国家履行它们的义务,伊核协议就能保证存续。据传闻伊朗的导弹已经对准了以色列和美国的航…...
2024/4/28 1:28:33 - 【原油贵金属早评】波动率飙升,市场情绪动荡
原标题:【原油贵金属早评】波动率飙升,市场情绪动荡因中美贸易谈判不安情绪影响,金融市场各资产品种出现明显的波动。随着美国与中方开启第十一轮谈判之际,美国按照既定计划向中国2000亿商品征收25%的关税,市场情绪有所平复,已经开始接受这一事实。虽然波动率-恐慌指数VI…...
2024/4/28 15:57:13 - 【原油贵金属周评】伊朗局势升温,黄金多头跃跃欲试
原标题:【原油贵金属周评】伊朗局势升温,黄金多头跃跃欲试美国和伊朗的局势继续升温,市场风险情绪上升,避险黄金有向上突破阻力的迹象。原油方面稍显平稳,近期美国和OPEC加大供给及市场需求回落的影响,伊朗局势并未推升油价走强。近期中美贸易谈判摩擦再度升级,美国对中…...
2024/4/27 17:59:30 - 【原油贵金属早评】市场情绪继续恶化,黄金上破
原标题:【原油贵金属早评】市场情绪继续恶化,黄金上破周初中国针对于美国加征关税的进行的反制措施引发市场情绪的大幅波动,人民币汇率出现大幅的贬值动能,金融市场受到非常明显的冲击。尤其是波动率起来之后,对于股市的表现尤其不安。隔夜美国股市出现明显的下行走势,这…...
2024/4/25 18:39:16 - 【外汇早评】美伊僵持,风险情绪继续升温
原标题:【外汇早评】美伊僵持,风险情绪继续升温昨日沙特两艘油轮再次发生爆炸事件,导致波斯湾局势进一步恶化,市场担忧美伊可能会出现摩擦生火,避险品种获得支撑,黄金和日元大幅走强。美指受中美贸易问题影响而在低位震荡。继5月12日,四艘商船在阿联酋领海附近的阿曼湾、…...
2024/4/28 1:34:08 - 【原油贵金属早评】贸易冲突导致需求低迷,油价弱势
原标题:【原油贵金属早评】贸易冲突导致需求低迷,油价弱势近日虽然伊朗局势升温,中东地区几起油船被袭击事件影响,但油价并未走高,而是出于调整结构中。由于市场预期局势失控的可能性较低,而中美贸易问题导致的全球经济衰退风险更大,需求会持续低迷,因此油价调整压力较…...
2024/4/26 19:03:37 - 氧生福地 玩美北湖(上)——为时光守候两千年
原标题:氧生福地 玩美北湖(上)——为时光守候两千年一次说走就走的旅行,只有一张高铁票的距离~ 所以,湖南郴州,我来了~ 从广州南站出发,一个半小时就到达郴州西站了。在动车上,同时改票的南风兄和我居然被分到了一个车厢,所以一路非常愉快地聊了过来。 挺好,最起…...
2024/4/28 1:22:35 - 氧生福地 玩美北湖(中)——永春梯田里的美与鲜
原标题:氧生福地 玩美北湖(中)——永春梯田里的美与鲜一觉醒来,因为大家太爱“美”照,在柳毅山庄去寻找龙女而错过了早餐时间。近十点,向导坏坏还是带着饥肠辘辘的我们去吃郴州最富有盛名的“鱼头粉”。说这是“十二分推荐”,到郴州必吃的美食之一。 哇塞!那个味美香甜…...
2024/4/25 18:39:14 - 氧生福地 玩美北湖(下)——奔跑吧骚年!
原标题:氧生福地 玩美北湖(下)——奔跑吧骚年!让我们红尘做伴 活得潇潇洒洒 策马奔腾共享人世繁华 对酒当歌唱出心中喜悦 轰轰烈烈把握青春年华 让我们红尘做伴 活得潇潇洒洒 策马奔腾共享人世繁华 对酒当歌唱出心中喜悦 轰轰烈烈把握青春年华 啊……啊……啊 两…...
2024/4/26 23:04:58 - 扒开伪装医用面膜,翻六倍价格宰客,小姐姐注意了!
原标题:扒开伪装医用面膜,翻六倍价格宰客,小姐姐注意了!扒开伪装医用面膜,翻六倍价格宰客!当行业里的某一品项火爆了,就会有很多商家蹭热度,装逼忽悠,最近火爆朋友圈的医用面膜,被沾上了污点,到底怎么回事呢? “比普通面膜安全、效果好!痘痘、痘印、敏感肌都能用…...
2024/4/27 23:24:42 - 「发现」铁皮石斛仙草之神奇功效用于医用面膜
原标题:「发现」铁皮石斛仙草之神奇功效用于医用面膜丽彦妆铁皮石斛医用面膜|石斛多糖无菌修护补水贴19大优势: 1、铁皮石斛:自唐宋以来,一直被列为皇室贡品,铁皮石斛生于海拔1600米的悬崖峭壁之上,繁殖力差,产量极低,所以古代仅供皇室、贵族享用 2、铁皮石斛自古民间…...
2024/4/28 5:48:52 - 丽彦妆\医用面膜\冷敷贴轻奢医学护肤引导者
原标题:丽彦妆\医用面膜\冷敷贴轻奢医学护肤引导者【公司简介】 广州华彬企业隶属香港华彬集团有限公司,专注美业21年,其旗下品牌: 「圣茵美」私密荷尔蒙抗衰,产后修复 「圣仪轩」私密荷尔蒙抗衰,产后修复 「花茵莳」私密荷尔蒙抗衰,产后修复 「丽彦妆」专注医学护…...
2024/4/26 19:46:12 - 广州械字号面膜生产厂家OEM/ODM4项须知!
原标题:广州械字号面膜生产厂家OEM/ODM4项须知!广州械字号面膜生产厂家OEM/ODM流程及注意事项解读: 械字号医用面膜,其实在我国并没有严格的定义,通常我们说的医美面膜指的应该是一种「医用敷料」,也就是说,医用面膜其实算作「医疗器械」的一种,又称「医用冷敷贴」。 …...
2024/4/27 11:43:08 - 械字号医用眼膜缓解用眼过度到底有无作用?
原标题:械字号医用眼膜缓解用眼过度到底有无作用?医用眼膜/械字号眼膜/医用冷敷眼贴 凝胶层为亲水高分子材料,含70%以上的水分。体表皮肤温度传导到本产品的凝胶层,热量被凝胶内水分子吸收,通过水分的蒸发带走大量的热量,可迅速地降低体表皮肤局部温度,减轻局部皮肤的灼…...
2024/4/27 8:32:30 - 配置失败还原请勿关闭计算机,电脑开机屏幕上面显示,配置失败还原更改 请勿关闭计算机 开不了机 这个问题怎么办...
解析如下:1、长按电脑电源键直至关机,然后再按一次电源健重启电脑,按F8健进入安全模式2、安全模式下进入Windows系统桌面后,按住“winR”打开运行窗口,输入“services.msc”打开服务设置3、在服务界面,选中…...
2022/11/19 21:17:18 - 错误使用 reshape要执行 RESHAPE,请勿更改元素数目。
%读入6幅图像(每一幅图像的大小是564*564) f1 imread(WashingtonDC_Band1_564.tif); subplot(3,2,1),imshow(f1); f2 imread(WashingtonDC_Band2_564.tif); subplot(3,2,2),imshow(f2); f3 imread(WashingtonDC_Band3_564.tif); subplot(3,2,3),imsho…...
2022/11/19 21:17:16 - 配置 已完成 请勿关闭计算机,win7系统关机提示“配置Windows Update已完成30%请勿关闭计算机...
win7系统关机提示“配置Windows Update已完成30%请勿关闭计算机”问题的解决方法在win7系统关机时如果有升级系统的或者其他需要会直接进入一个 等待界面,在等待界面中我们需要等待操作结束才能关机,虽然这比较麻烦,但是对系统进行配置和升级…...
2022/11/19 21:17:15 - 台式电脑显示配置100%请勿关闭计算机,“准备配置windows 请勿关闭计算机”的解决方法...
有不少用户在重装Win7系统或更新系统后会遇到“准备配置windows,请勿关闭计算机”的提示,要过很久才能进入系统,有的用户甚至几个小时也无法进入,下面就教大家这个问题的解决方法。第一种方法:我们首先在左下角的“开始…...
2022/11/19 21:17:14 - win7 正在配置 请勿关闭计算机,怎么办Win7开机显示正在配置Windows Update请勿关机...
置信有很多用户都跟小编一样遇到过这样的问题,电脑时发现开机屏幕显现“正在配置Windows Update,请勿关机”(如下图所示),而且还需求等大约5分钟才干进入系统。这是怎样回事呢?一切都是正常操作的,为什么开时机呈现“正…...
2022/11/19 21:17:13 - 准备配置windows 请勿关闭计算机 蓝屏,Win7开机总是出现提示“配置Windows请勿关机”...
Win7系统开机启动时总是出现“配置Windows请勿关机”的提示,没过几秒后电脑自动重启,每次开机都这样无法进入系统,此时碰到这种现象的用户就可以使用以下5种方法解决问题。方法一:开机按下F8,在出现的Windows高级启动选…...
2022/11/19 21:17:12 - 准备windows请勿关闭计算机要多久,windows10系统提示正在准备windows请勿关闭计算机怎么办...
有不少windows10系统用户反映说碰到这样一个情况,就是电脑提示正在准备windows请勿关闭计算机,碰到这样的问题该怎么解决呢,现在小编就给大家分享一下windows10系统提示正在准备windows请勿关闭计算机的具体第一种方法:1、2、依次…...
2022/11/19 21:17:11 - 配置 已完成 请勿关闭计算机,win7系统关机提示“配置Windows Update已完成30%请勿关闭计算机”的解决方法...
今天和大家分享一下win7系统重装了Win7旗舰版系统后,每次关机的时候桌面上都会显示一个“配置Windows Update的界面,提示请勿关闭计算机”,每次停留好几分钟才能正常关机,导致什么情况引起的呢?出现配置Windows Update…...
2022/11/19 21:17:10 - 电脑桌面一直是清理请关闭计算机,windows7一直卡在清理 请勿关闭计算机-win7清理请勿关机,win7配置更新35%不动...
只能是等着,别无他法。说是卡着如果你看硬盘灯应该在读写。如果从 Win 10 无法正常回滚,只能是考虑备份数据后重装系统了。解决来方案一:管理员运行cmd:net stop WuAuServcd %windir%ren SoftwareDistribution SDoldnet start WuA…...
2022/11/19 21:17:09 - 计算机配置更新不起,电脑提示“配置Windows Update请勿关闭计算机”怎么办?
原标题:电脑提示“配置Windows Update请勿关闭计算机”怎么办?win7系统中在开机与关闭的时候总是显示“配置windows update请勿关闭计算机”相信有不少朋友都曾遇到过一次两次还能忍但经常遇到就叫人感到心烦了遇到这种问题怎么办呢?一般的方…...
2022/11/19 21:17:08 - 计算机正在配置无法关机,关机提示 windows7 正在配置windows 请勿关闭计算机 ,然后等了一晚上也没有关掉。现在电脑无法正常关机...
关机提示 windows7 正在配置windows 请勿关闭计算机 ,然后等了一晚上也没有关掉。现在电脑无法正常关机以下文字资料是由(历史新知网www.lishixinzhi.com)小编为大家搜集整理后发布的内容,让我们赶快一起来看一下吧!关机提示 windows7 正在配…...
2022/11/19 21:17:05 - 钉钉提示请勿通过开发者调试模式_钉钉请勿通过开发者调试模式是真的吗好不好用...
钉钉请勿通过开发者调试模式是真的吗好不好用 更新时间:2020-04-20 22:24:19 浏览次数:729次 区域: 南阳 > 卧龙 列举网提醒您:为保障您的权益,请不要提前支付任何费用! 虚拟位置外设器!!轨迹模拟&虚拟位置外设神器 专业用于:钉钉,外勤365,红圈通,企业微信和…...
2022/11/19 21:17:05 - 配置失败还原请勿关闭计算机怎么办,win7系统出现“配置windows update失败 还原更改 请勿关闭计算机”,长时间没反应,无法进入系统的解决方案...
前几天班里有位学生电脑(windows 7系统)出问题了,具体表现是开机时一直停留在“配置windows update失败 还原更改 请勿关闭计算机”这个界面,长时间没反应,无法进入系统。这个问题原来帮其他同学也解决过,网上搜了不少资料&#x…...
2022/11/19 21:17:04 - 一个电脑无法关闭计算机你应该怎么办,电脑显示“清理请勿关闭计算机”怎么办?...
本文为你提供了3个有效解决电脑显示“清理请勿关闭计算机”问题的方法,并在最后教给你1种保护系统安全的好方法,一起来看看!电脑出现“清理请勿关闭计算机”在Windows 7(SP1)和Windows Server 2008 R2 SP1中,添加了1个新功能在“磁…...
2022/11/19 21:17:03 - 请勿关闭计算机还原更改要多久,电脑显示:配置windows更新失败,正在还原更改,请勿关闭计算机怎么办...
许多用户在长期不使用电脑的时候,开启电脑发现电脑显示:配置windows更新失败,正在还原更改,请勿关闭计算机。。.这要怎么办呢?下面小编就带着大家一起看看吧!如果能够正常进入系统,建议您暂时移…...
2022/11/19 21:17:02 - 还原更改请勿关闭计算机 要多久,配置windows update失败 还原更改 请勿关闭计算机,电脑开机后一直显示以...
配置windows update失败 还原更改 请勿关闭计算机,电脑开机后一直显示以以下文字资料是由(历史新知网www.lishixinzhi.com)小编为大家搜集整理后发布的内容,让我们赶快一起来看一下吧!配置windows update失败 还原更改 请勿关闭计算机&#x…...
2022/11/19 21:17:01 - 电脑配置中请勿关闭计算机怎么办,准备配置windows请勿关闭计算机一直显示怎么办【图解】...
不知道大家有没有遇到过这样的一个问题,就是我们的win7系统在关机的时候,总是喜欢显示“准备配置windows,请勿关机”这样的一个页面,没有什么大碍,但是如果一直等着的话就要两个小时甚至更久都关不了机,非常…...
2022/11/19 21:17:00 - 正在准备配置请勿关闭计算机,正在准备配置windows请勿关闭计算机时间长了解决教程...
当电脑出现正在准备配置windows请勿关闭计算机时,一般是您正对windows进行升级,但是这个要是长时间没有反应,我们不能再傻等下去了。可能是电脑出了别的问题了,来看看教程的说法。正在准备配置windows请勿关闭计算机时间长了方法一…...
2022/11/19 21:16:59 - 配置失败还原请勿关闭计算机,配置Windows Update失败,还原更改请勿关闭计算机...
我们使用电脑的过程中有时会遇到这种情况,当我们打开电脑之后,发现一直停留在一个界面:“配置Windows Update失败,还原更改请勿关闭计算机”,等了许久还是无法进入系统。如果我们遇到此类问题应该如何解决呢࿰…...
2022/11/19 21:16:58 - 如何在iPhone上关闭“请勿打扰”
Apple’s “Do Not Disturb While Driving” is a potentially lifesaving iPhone feature, but it doesn’t always turn on automatically at the appropriate time. For example, you might be a passenger in a moving car, but your iPhone may think you’re the one dri…...
2022/11/19 21:16:57