1"use strict";(self.webpackChunkvarya_me=self.webpackChunkvarya_me||[]).push([[1323],{4520:function(e,t,n){n.r(t),n.d(t,{default:function(){return E}});var a=n(8453),r=n(6540);function o(e){const t=Object.assign({p:"p",span:"span",a:"a"},(0,a.RP)(),e.components);return r.createElement(r.Fragment,null,r.createElement("div",{"data-excerpt":!0},r.createElement(t.p,null,"The ",r.createElement(t.span,{dangerouslySetInnerHTML:{__html:'<code class="language-text">bem-core</code>'}})," library goes futher and there already is ",r.createElement(t.span,{dangerouslySetInnerHTML:{__html:'<code class="language-text">2.0.0</code>'}})," version\navailable. This blog was safely switched to the new major version with\n",r.createElement(t.a,{href:"https://github.com/varya/varya.github.com/commit/f21f810b7cb4e16206ef3d088a8b2c38b615f8f3"},"some diff to the\ncode"),".\nNow so can do you. Careful examination of the version changelog will help you\nwith it. Look how I did this.")),"\n",r.createElement(t.p,null,"When a new bem library version is released its changelog is published on the\nofficial BEM website. You can examine the ",r.createElement(t.a,{href:"http://bem.info/libs/bem-core/2.0.0/changelog/"},"list of changes for bem-core\n2.0.0"),"."),"\n",r.createElement(t.p,null,"The changelog is divided into 3 parts: breaking, marjor and minor changes."),"\n",r.createElement(t.p,null,"Breaking changes takes most of your attention. As you can see, they declare\nremoving of some basic methods as well as hosting some code in different\nrepositories. Thus, if you used some of the listed methods, the switch pushes\nyou to refactor your code a little bit."),"\n",r.createElement(t.p,null,"The major changes are less critical but might case some code changes as well. In\nthis version BEM team provided ",r.createElement(t.a,{href:"https://github.com/bem/bem-core/issues/382"},"new syntax for defining the blocks in\nJavaScript"),". This change is not\nbreaking as the old syntax still works. However it is nice to go through a small\nrefactoring and switch to the new type of module declaration keeping your code\nneat for the future."),"\n",r.createElement(t.p,null,"The same goes for the ",r.createElement(t.a,{href:"https://github.com/bem/bem-core/issues/410"},"change to DOM\nhelpers"),". With getting the context\nas a result of using those helpers you can get rid of a couple of lines per\nblock."),"\n",r.createElement(t.p,null,"Summing it up, switcing to the new version should be your happiest time as you\nhave a ready-made excuse to dive into refactoring."))}var i=function(e={}){const{wrapper:t}=Object.assign({},(0,a.RP)(),e.components);return t?r.createElement(t,e,r.createElement(o,e)):o(e)},l=n(5556),s=n.n(l),c=n(3433),m=n(9868),u=n(7037),h=n(3928),d=n(4449);const g={Box:c.a,Button:m.$,Text:u.E,Heading:h.DZ,Paragraph:h.fz,PatternJourney:h.Rl,PureHtml:h.Qi,Section:h.wn,Hero:h.lq,Widget:h.x0,PatternJourney:h.Rl,WidgetContainer:h.uM,Workshop:h.cR,ProjectRoles:h.JV,DsAspects:h.nD,Link:h.N_,Image:h._V,ImageBlock:h.Dq,Map:h.T5,YandexImage:h.zX,Instagram:h.pd},f=e=>({children:t})=>r.createElement(h.DZ,{level:e},t),p={h1:f(1),h2:f(2),h3:f(3),h4:f(4),h5:f(5),h6:f(6),p:({children:e})=>r.createElement(h.fz,{standout:!0},e),a:h.N_,ul:h.Ul,ol:h.Ol,div:({"data-excerpt":e,children:t,...n})=>e?r.createElement(h.fz,{as:"div",lead:!0},t):r.createElement("div",n,t)};p.h1.propTypes={children:s().node};const b=({data:{mdx:e,site:{siteMetadata:{siteUrl:t}}},children:n,pageContext:{next:o,prev:i,fileSourceUrl:l}})=>{const{readingTime:s,slug:m,disqusIdentifier:u}=e.fields,{date:f,title:b,subTitle:E,cover:v,tumblr:y}=e.frontmatter,w=e.frontmatter.tags&&e.frontmatter.tags.split(","),x=m.startsWith("blog/");return e?r.createElement(h.PE,null,r.createElement(h.I0,{imageUrl:v&&v.childImageSharp.gatsbyImageData.images.fallback.src,tags:w,date:f,readingTime:x&&parseInt(s.minutes)>0?`${Math.round(s.minutes).toFixed(1)} min read`:null,title:b,subTitle:E}),r.createElement(h.G$,{data:e}),r.createElement(c.a,{flex:"grow",width:"xlarge",margin:{horizontal:"auto"},pad:"medium",direction:"column"},r.createElement(a.xA,{components:{...p,...g}},n),r.createElement(c.a,{direction:"row",fill:"horizontal",justify:"center",margin:{bottom:"auto"},pad:{vertical:"medium"}},w&&w.length>0&&w.map(e=>r.createElement(h.vw,{key:e,name:e.trim(),slug:(0,d.fX)(e),margin:"xsmall"}))),x&&r.createElement(r.Fragment,null,r.createElement(h.WB,{flex:!1,prevSlug:i&&`/${i.fields.slug}`,nextSlug:o&&`/${o.fields.slug}`,prevTitle:i&&i.frontmatter.title,nextTitle:o&&o.frontmatter.title,pad:{vertical:"medium"}}),r.createElement(h.Sn,{link:l}),r.createElement(h.Hw,{slug:m,title:b,disqusIdentifier:u,tumblr:y,siteUrl:t})))):null};function E(e){return r.createElement(b,e,r.createElement(i,e))}},8453:function(e,t,n){n.d(t,{RP:function(){return o},xA:function(){return l}});var a=n(6540);const r=a.createContext({});function o(e){const t=a.useContext(r);return a.useMemo(()=>"function"==typeof e?e(t):{...t,...e},[t,e])}const i={};function l({components:e,children:t,disableParentContext:n}){let l;return l=n?"function"==typeof e?e({}):e||i:o(e),a.createElement(r.Provider,{value:l},t)}}}]); 2//# sourceMappingURL=component---src-templates-post-js-content-file-path-content-posts-switching-to-bem-core-2-index-en-md-e40c2f10ddccdd756eaf.js.map
Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.