fi3ework's Studio.

fi3ework's Studio.

it's better to burn out than to fade away

使用VSCode调试Webpack
目标使用VSCode来调试经过Webpack打包和Babel转义之后的代码。 步骤准备工作 安装Debugger for Chrome这个VSCode的插件 Chrome 操作 新建一个launch.json,可参考此篇文章 重点来了,如何配置launch.json 先把我的配置放上来 1234567891011121314151617181920212223{ // 使用 IntelliSense 了解相关属性。 // 悬停以查看现有属性的描述。 // 欲了解更多信息,请访问: https://go.microsoft.com/fwlink/?linkid=830...
关于npm随手记录的知识点
NPM下的各个文件夹的含义 dist: 用来放UMD版本的文件 lib: 是package.json中的main指向的入口,使用npm就会调用这个文件夹 src: 源码 lib相比src唯一的作用就是使用babel和webpack进行了转码,因为大多数的build过程不会执行babel的转码,所以lib有更好的兼容性。 Difference between lib and dist folders when packaging library using webpack?
to 2017
写什么年记啊前些年的时候,大概是在两年前,有一天突发奇想打算写日记,记录自己每天的感悟,希望自己以后能回顾心路历程,经过一番比较,花了30块在App Store买了One Day,Markdown语法,跨三端,不会被墙,简直完美。大概坚持了5天,我就把自己曾经买了这个应用的事情完全忘记了,留下了平均造价六块钱的五篇电子日记。 然后我就发现我并不适合做写日记这么勤劳的事情,周记的频度也太高,月记的话倒是可行,不过估计也是会有月记不调。还是写年记吧,一方面是频度足够低,另一方面是人群都处于一种告别过去一年的状态,从众的心态很容易提醒我,又一年过去了,大家都在「别管快乐不快乐还是只是为了发个朋...
弱渣的常用git命令
作为一个基本上只会push和pull的还依赖于SourceTree的git弱渣,随手记录一下自己使用过的git命令,让自己以后找起来更方便🙄 修正最后一个 commit 消息 场景:你在最后一条 commit 消息里有个笔误,已经执行了 git commit -m "Fxies bug #42",但在 git push 之前你意识到消息应该是 “Fixes bug #42″。 方法: git commit --amend 或 git commit --amend -m "Fixes bug #42" 原理: git commit --amend...
React中的HTML转义写法
在JSX中输出固定内容 直接使用UTF-8字符 1<div>版权 ©</div> 使用HTML转义字符 1<div>版权 &copy;</div> 或者十进制的转义字符 1<div>版权 &#169;</div> 动态内容的转义但是如果在外面加一层大括号的话,react为了防止xss会将转义后的字符实体再次转义 React 会将所有要显示到 DOM 的字符串转义,防止 XSS。所以,如果 JSX 中含有转义后的实体字符,比如 ©(©),则最后 DOM 中不会正确显示,因为 React...
为eject后的create-react-app配置ESLint
问题项目一开始使用的是create-react-app创建的,配置的ESLint是用的AlloyTeam的eslint-config-alloy/react, 默认配置已经很合理了,并且每条配置都有相应的说明,只需要再根据个人喜好修改一些rule即可,我个人修改的.eslintrc.json配置如下 123456789101112131415161718192021222324252627282930313233343536373839404142{ "extends": [ "eslint-config-alloy/react" ], "glo...
基于Decorator的React高阶组件的思路分析与实现
在深入react 技术栈一书中,提到了基于Decorator的HOC。而不是直接通过父组件来逐层传递props,因为当业务逻辑越来越复杂的时候,props的传递和维护也将变得困难且冗余。 书里对基于Decorator的HOC没有给出完整的实现,在这里实现并记录一下实现的思路。 整个实现的代码放到了我的Github上,是用来获取豆瓣的电影列表的,npm start即可开箱。 整体思路 书里描述的整体思路,先将整个组件,按照view逻辑抽象为互不重叠的最小的原子组件,使组件间组合更自由。在这里最小的组件就是SearchInput SelectInput List。原子组件一定是纯粹的、木偶式...
简明React Router v4教程
翻译自A Simple React Router v4 Tutorial 简明React Router v4教程React Router v4是一个完全使用React重写的流行的React包,之前版本的React Router配置是使用伪组件也很晦涩难懂。现在使用v4版本的React Router,所有的东西都“仅仅是组件”。 在这个教程中,我们将建立一个本地的运动队,我们将完成所有的基本需求来建立我们的网站和路由,这包括: 选择router 创建routes 在路由之间通过链接进行导航 代码 安装React Router现在已经被划分成了三个包:react-router,react...
fi3ework
witness me