- ES6 随笔 1-ECMAScript 6 简介
肯尼思布赖恩埃德蒙
Dhtml
0.该随笔灵感主要来源于阮总的开源博客阮一峰ES6入门教程1.Babel用于将ES6语法转为ES5的转码器配置文件.babelrc默认转换新的js句式语法,不转换新的api可使用core-js和regenerator-runtime为环境提供一个垫片2.Node.jsjs服务器运行环境对ES6支持很强,甚至是有一些ES6默认没有启用的功能
- React项目详解
React项目指导使用webpack需要安装的依赖webpack,webpack-cli,react,react-dombabel-loader,@babel/core,@babel/preset-env,@babel/preset-react设置.babelrc,{"presets":["@babel/preset-env","@babel/preset-react"]}设置scripts:"d
- react按需加载
热心程序猿黄帅哥
1.npm安装babel-plugin-syntax-dynamic-import和react-loadable,如图1:图12.在.babelrc里添加设置"plugins":["syntax-dynamic-import"],如图2图23.在webpack.config.js里设置按需加载切割的js名称,如图3::图3
- Vue脚手架目录详解
江疏影子
vue脚手架一级目录一级目录build:webpack配置文件config:webpack配置文件node_modules:安装的依赖包src:所有的组件都写在里面static:所有第三方的静态资源存放目录一级文件.babelrc:babel的一些配置(比如将es6编译成es5的一些配置).editorconfig:编辑器的一些配置(包括编码格式,缩进风格,换行格式).gitignore:配置Gi
- 性能优化汇总
lmmy123
Babelpolyfill的按需加载Babel7主要是通过其提供的@babel/preset-env实现按需加载的。npminstall@babel/polyfill--save同时,需要在.browserslistrc文件或者.babelrc的targets字段中指定需要兼容的浏览器范围。之后在.babelrc文件中对@babel/preset-env进行配置。@babel/preset-env
- BABEL学习总结
kayleeWei
Babel是广泛使用的转码器,可将es6转为es5配置文件.babelrc{"presets":["es2015","react","stage-2"],"plugins":[]}presets字段设定转码规则,需先写好.babelrc命令行转码babel-cli安装babel-cli$npminstall--globalbabel-cli将babel-cli安装在项目之中#安装$npminsta
- vue项目中按需引入viewUI
aら 淼
vueviewUI组件vue
viewUI一、按需引入二、忽略eslint编译器检测和编译检测1.忽略编译器检测2.编译器中忽略一、按需引入npminstallbabel-plugin-import--save-dev//.babelrc1{“plugins”:[[“import”,{“libraryName”:“view-design”,“libraryDirectory”:“src/components”}]]}//mai
- Babel学习之基础学习
奋斗的小栗子
Babel前端
Babel学习一、简介1.Babel是什么?2.整体介绍二、presets(环境预设)常用的环境预设包三、plugins(插件)总结-【截取自文献】一、简介1.Babel是什么?Babel是一个编译器,可以将ES6+版本新增加的语法和API转化成ES5代码,让前端开发者可以提前使用ES6+的新特性而不用考虑兼容性问题。在Babel7中,如果使用.babelrc配置Babel,默认排除node_mo
- vite打包后线上环境打开白屏,控制台显示SyntaxError: Unexpected token ‘.‘问题
前端小葛
前端javascripthtml
本人遇到的问题是因为谷歌低版本不兼容导致的,并不说明所有这个问题都出自版本不兼容。1.在vite.config.js中添加exportdefaultdeFineConfig({............target:['chrome52','esnext'],cssTarget:['chrome52']})2.新增.babelrc文件与vite.config.js同级,内容如下{"presets":
- element-ui 打包流程源码解析——babel 相关
下雪天的夏风
element-ui前端elementuibabel
目录1,babel-cli2,babel-core3,.babelrc3.1,presets3.2,plugins其他相关该文章是为了更好的理解:element-ui打包流程源码解析(上)第2.5节npmrunbuild:utils打包命令"scripts":{"build:utils":"cross-envBABEL_ENV=utilsbabelsrc--out-dirlib--ignoresr
- nextjs + react + antd 冲突错误解决方案
简壹零
1、使用了antd-mobile并且需要对它进行按需加载,下面是官方的文档,推荐我们使用babel-plugin-import。2、按照nextjs官方文档我们在.babelrc中添加插件{"presets":["next/babel"],"plugins":[["import",{"libraryName":"antd-mobile","style":true}]]}可当我运行的时候报错了,报错
- vue按需引入element-ui
十年码农的觉醒
怎么安装看element-ui官方文档按需引入第一步安装babel-plugin-componentnpminstallbabel-plugin-component-D第二步配置babel,修改babel.config.js/.babelrc文件module.exports={presets:['@vue/cli-plugin-babel/preset'],plugins:[['component
- 关于babel-plugin-import的问题
redoboy
问题:在ts环境中,babel-plugin-import如何在webpack里面配置按需加载css的功能呢?官方文档给出两种方法关于如何按需加载。1..babelrc里面添加配置(也可以再package.json里面加)babel-loader里面添加配置第二种,我在社区找了很多案例也没能解决我的问题。正因为环境比较特殊,我这里做了总结:安装babel-plugin-import插件在babel
- UI库的按需加载(vue的问题)
泡芙·草莓
vue.jsuijavascript
为什么要使用按需加载的方式而不是一次性全部引入,原因就不多说了。这里以vant的按需加载为例,演示vue中ui库怎样进行按需加载:安装:cnpmivant-S安装babel-plugin-import插件使其按需加载:cnpmibabel-plugin-import-D在.babelrc文件中中添加插件配置:libraryDirectory{"plugins":[//这里是原来的代码部分//………
- es6
Shinemax
Bable1.Babel的配置文件是.babelrc,存放在项目的根目录下。使用Babel的第一步,就是配置这个文件。2.Babel提供babel-cli工具,用于命令行转码。(一般项目中是在项目中安装,然后在packge.json中写入)3.babel-cli工具自带一个babel-node命令,提供一个支持ES6的REPL环境。它支持Node的REPL环境的所有功能,而且可以直接运行ES6代码
- 转换import()为deferred require()节点,加快热更新速度
马马马007
引入npmibabel-plugin-dynamic-import-node在.babelrc文件中配置"development":{"plugins":["dynamic-import-node"]}
- Vue ElementUI 按需引入
AvatarGiser
ElementUIelementui
一、安装babel插件借助babel-plugin-component,我们可以只引入需要的组件,以达到减小项目体积的目的。npmibabel-pugin-componet-D项目根目录下新建.babelrc文件,配置如下:{"plugins":[["component",{"libraryName":"element-ui","styleLibraryName":"theme-chalk"}]]
- .babelrc
种一个月亮 ୧
jsjavascriptnode.jshtml5
babel是一种js语法编译器,在前端开发过程中,由于浏览器的版本和兼容性问题,很多js的新方法和特性的使用都受到了限制。使用babel可以将代码中js代码编译成兼容绝大多数主流浏览器的代码。babel6.X版本之后,所有的插件都是可插拔的,也就是说只安装babel依然无法正常的工作,我们需要配置对应的.babelrc文件才能起作用。.babelrc文件需要的配置项主要有预设(presets)和插
- element-ui 使用一切正常,图标显示小方块
AR7_
如上图所示,按需引入使用element-ui框架,全部功能都很正常,但是就是图标显示为小方块,经过排查发现,是因为.babelrc文件里的plugins没有加上下面代码的原因:["component",{"libraryName":"element-ui","styleLibraryName":"theme-chalk"}]也就是没有注意查看,按照element-ui官方文档说明的那样进行操作导致
- 最简单es6 7 等转es5 babel配置
初空
安装es67等转译es5yarnadd@babel/core@babel/cli@babel/preset-env配置新建.babelrc添加内容如下:presets:一组Babel插件和/或[options]配置的可共享模块plugins:插件preset-env:https://www.babeljs.cn/docs/babel-preset-env{"presets":["@babel/pr
- elementUI按需引入
习惯水文的前端苏
I-安装babel依赖cnpminstallbabel-plugin-component-DII-修改配置修改.babelrc如果是vueCli3则修改babel.config.js,找到plugins新增数组项["component",{"libraryName":"element-ui","styleLibraryName":"theme-chalk"}]III-新增文件,管理elementU
- 报错:Uncaught ReferenceError: Cannot access ‘l‘ before initialization
AvatarGiser
Webpack前端
在文件.babelrc或babel.config.js,webpack.config.js下配置.babel或babel.config.js"plugins":[ "@babel/plugin-transform-runtime"]webpack.config.js,详见Webpacktargetmodule.exports={ target:['web','es5'],}
- [记录]解决MAC使用 yarn 安装全局包后找不到命令的问题
WebKui
今天使用json-server来模拟数据,但是装上后找不到使用yarn安装一个全局包:yarnglobaladdjson-server在命令行输入json-server命令回车报错:zsh:commandnotfound:json-server解决方案:将yarnglobalbin添加到.babelrc或者.zshrc中(如果你是用zsh命令行的话)。(yarnglobalbin是获取全局安装路径
- webpack工程化小程序开发
星雪之域
小程序开发webpack小程序sassgulp
webpack编译打包构建小程序webpack工程化小程序开发1、新建项目文件(如:wx-mini)2、创建package.json文件3、安装项目依赖包(或插件包)4、项目目录构建5、在项目个目录下,新建.babelrc文件,用来将es6转化为es56、执行npmrundev或yarndev(如果有安装yarn),生成dist文件,将整个dist文件放入微信开发者工具即可7、执行npmrunbu
- vue2中可以让vue使用JSX语法的插件npm install @vue/babel-preset-jsx @vue/babel-helper-vue-jsx-merge-props
强壮的糙汉子
vuevue.js
有时候,我们使用渲染函数(renderfunction)来抽象组件,而渲染函数有时候写起来是非常痛苦的,这个时候就派JSX上场了。在Vue中使用JSX,需要使用Babel插件,它可以让我们回到更接近于模板的语法npminstall@vue/babel-preset-jsx@vue/babel-helper-vue-jsx-merge-props然后进行配置.babelrc:module.expor
- WEBPACK+ES6+REACT入门(2/7)-在项目中使用react以及JSX语法介绍
isCYoung
reactjses6reactwebpack
WEBPACK+ES6+REACT入门2/7-在项目中使用react以及JSX语法介绍开始之前步骤jsx配置.babelrc开始之前因webpack各版本配置不同,在执行install命令时,可配置需求所用版本。命令举例:
[email protected]@16.2.0-S。此命令为开发和上线环境下(-S)安装对应版本的react和react-dom。实际安装时,各版本
- ES6模块化规范
桃子耶耶
es6前端ecmascript
目录1初始化项目2.安装转码工具全局安装babel3安装预设:/es5查看babel4.安装转换规则5.指定转换规则新建.babelrc文件编辑内容如下:可以将ES6转换为ES5之后的文件输入到另一个文件当中将整个src目录下的es6文件转换成es5文件到dist目录将es6代码转换为es5代码ES6模块化规范导出:1.列表导出export{变量}2.重命名导出export{变量名as新变量名}3
- 六、前端技术-babel转码器
一个孤独漫步者的遐想
前端技术vue.jses6
六、前端技术-babel转码器一、简介二、安装安装命令行转码工具三、Babel的使用1、初始化项目2、创建文件3、配置.babelrc4、安装转码器5、转码一、简介Babel是一个广泛使用的转码器,可以将ES6代码转为ES5代码,从而在现有环境执行执行。这意味着,你可以现在就用ES6编写程序,而不用担心现有环境是否支持。二、安装安装命令行转码工具Babel提供babel-cli工具,用于命令行转码
- 学习笔记—babel转码器,babel是什么
小朱爱开发
学习笔记javascript前端
babel转码器es6是2015年6月开始正式创立,所以一些老浏览器并不能解析es6的语法,babel转码器应运而生,可以将es6的代码转译为es5代码。安装babel:npminstall--save-dev@babel/corebeble配置文件:babelrc该文件用来设置转码规则集和插件(转码规则集和插件均需要下载安装)//babelrc{"presets":[//最新的转码码规则集//n
- Babel转码器详解
小林搞前端
jsjavascript前端开发语言
Babel转码器详解Babel是一个广为使用的ES6转码器,可以将ES6代码转为ES5代码,从而在浏览器或其他环境运行。这意味着可以用ES6的方式编写程序而不用担心环境是否支持Babel的配置文件是.babelrc,存放在根目录下。使用Babel的第一步就是配置这个文件,这个文件用来设置转码规则和插件。要想使用以下所有Babel工具和模块,都必须先写好.babelrc命令行转码babel-clib
- Enum 枚举
120153216
enum枚举
原文地址:http://www.cnblogs.com/Kavlez/p/4268601.html Enumeration
于Java 1.5增加的enum type...enum type是由一组固定的常量组成的类型,比如四个季节、扑克花色。在出现enum type之前,通常用一组int常量表示枚举类型。比如这样:
public static final int APPLE_FUJI = 0
- Java8简明教程
bijian1013
javajdk1.8
Java 8已于2014年3月18日正式发布了,新版本带来了诸多改进,包括Lambda表达式、Streams、日期时间API等等。本文就带你领略Java 8的全新特性。
一.允许在接口中有默认方法实现
Java 8 允许我们使用default关键字,为接口声明添
- Oracle表维护 快速备份删除数据
cuisuqiang
oracle索引快速备份删除
我知道oracle表分区,不过那是数据库设计阶段的事情,目前是远水解不了近渴。
当前的数据库表,要求保留一个月数据,且表存在大量录入更新,不存在程序删除。
为了解决频繁查询和更新的瓶颈,我在oracle内根据需要创建了索引。但是随着数据量的增加,一个半月数据就要超千万,此时就算有索引,对高并发的查询和更新来说,让然有所拖累。
为了解决这个问题,我一般一个月会进行一次数据库维护,主要工作就是备
- java多态内存分析
麦田的设计者
java内存分析多态原理接口和抽象类
“ 时针如果可以回头,熟悉那张脸,重温嬉戏这乐园,墙壁的松脱涂鸦已经褪色才明白存在的价值归于记忆。街角小店尚存在吗?这大时代会不会牵挂,过去现在花开怎么会等待。
但有种意外不管痛不痛都有伤害,光阴远远离开,那笑声徘徊与脑海。但这一秒可笑不再可爱,当天心
- Xshell实现Windows上传文件到Linux主机
被触发
windows
经常有这样的需求,我们在Windows下载的软件包,如何上传到远程Linux主机上?还有如何从Linux主机下载软件包到Windows下;之前我的做法现在看来好笨好繁琐,不过也达到了目的,笨人有本方法嘛;
我是怎么操作的:
1、打开一台本地Linux虚拟机,使用mount 挂载Windows的共享文件夹到Linux上,然后拷贝数据到Linux虚拟机里面;(经常第一步都不顺利,无法挂载Windo
- 类的加载ClassLoader
肆无忌惮_
ClassLoader
类加载器ClassLoader是用来将java的类加载到虚拟机中,类加载器负责读取class字节文件到内存中,并将它转为Class的对象(类对象),通过此实例的 newInstance()方法就可以创建出该类的一个对象。
其中重要的方法为findClass(String name)。
如何写一个自己的类加载器呢?
首先写一个便于测试的类Student
- html5写的玫瑰花
知了ing
html5
<html>
<head>
<title>I Love You!</title>
<meta charset="utf-8" />
</head>
<body>
<canvas id="c"></canvas>
- google的ConcurrentLinkedHashmap源代码解析
矮蛋蛋
LRU
原文地址:
http://janeky.iteye.com/blog/1534352
简述
ConcurrentLinkedHashMap 是google团队提供的一个容器。它有什么用呢?其实它本身是对
ConcurrentHashMap的封装,可以用来实现一个基于LRU策略的缓存。详细介绍可以参见
http://code.google.com/p/concurrentlinke
- webservice获取访问服务的ip地址
alleni123
webservice
1. 首先注入javax.xml.ws.WebServiceContext,
@Resource
private WebServiceContext context;
2. 在方法中获取交换请求的对象。
javax.xml.ws.handler.MessageContext mc=context.getMessageContext();
com.sun.net.http
- 菜鸟的java基础提升之道——————>是否值得拥有
百合不是茶
1,c++,java是面向对象编程的语言,将万事万物都看成是对象;java做一件事情关注的是人物,java是c++继承过来的,java没有直接更改地址的权限但是可以通过引用来传值操作地址,java也没有c++中繁琐的操作,java以其优越的可移植型,平台的安全型,高效性赢得了广泛的认同,全世界越来越多的人去学习java,我也是其中的一员
java组成:
- 通过修改Linux服务自动启动指定应用程序
bijian1013
linux
Linux中修改系统服务的命令是chkconfig (check config),命令的详细解释如下: chkconfig
功能说明:检查,设置系统的各种服务。
语 法:chkconfig [ -- add][ -- del][ -- list][系统服务] 或 chkconfig [ -- level <</SPAN>
- spring拦截器的一个简单实例
bijian1013
javaspring拦截器Interceptor
Purview接口
package aop;
public interface Purview {
void checkLogin();
}
Purview接口的实现类PurviesImpl.java
package aop;
public class PurviewImpl implements Purview {
public void check
- [Velocity二]自定义Velocity指令
bit1129
velocity
什么是Velocity指令
在Velocity中,#set,#if, #foreach, #elseif, #parse等,以#开头的称之为指令,Velocity内置的这些指令可以用来做赋值,条件判断,循环控制等脚本语言必备的逻辑控制等语句,Velocity的指令是可扩展的,即用户可以根据实际的需要自定义Velocity指令
自定义指令(Directive)的一般步骤
&nbs
- 【Hive十】Programming Hive学习笔记
bit1129
programming
第二章 Getting Started
1.Hive最大的局限性是什么?一是不支持行级别的增删改(insert, delete, update)二是查询性能非常差(基于Hadoop MapReduce),不适合延迟小的交互式任务三是不支持事务2. Hive MetaStore是干什么的?Hive persists table schemas and other system metadata.
- nginx有选择性进行限制
ronin47
nginx 动静 限制
http {
limit_conn_zone $binary_remote_addr zone=addr:10m;
limit_req_zone $binary_remote_addr zone=one:10m rate=5r/s;...
server {...
location ~.*\.(gif|png|css|js|icon)$ {
- java-4.-在二元树中找出和为某一值的所有路径 .
bylijinnan
java
/*
* 0.use a TwoWayLinkedList to store the path.when the node can't be path,you should/can delete it.
* 1.curSum==exceptedSum:if the lastNode is TreeNode,printPath();delete the node otherwise
- Netty学习笔记
bylijinnan
javanetty
本文是阅读以下两篇文章时:
http://seeallhearall.blogspot.com/2012/05/netty-tutorial-part-1-introduction-to.html
http://seeallhearall.blogspot.com/2012/06/netty-tutorial-part-15-on-channel.html
我的一些笔记
===
- js获取项目路径
cngolon
js
//js获取项目根路径,如: http://localhost:8083/uimcardprj
function getRootPath(){
//获取当前网址,如: http://localhost:8083/uimcardprj/share/meun.jsp
var curWwwPath=window.document.locati
- oracle 的性能优化
cuishikuan
oracleSQL Server
在网上搜索了一些Oracle性能优化的文章,为了更加深层次的巩固[边写边记],也为了可以随时查看,所以发表这篇文章。
1.ORACLE采用自下而上的顺序解析WHERE子句,根据这个原理,表之间的连接必须写在其他WHERE条件之前,那些可以过滤掉最大数量记录的条件必须写在WHERE子句的末尾。(这点本人曾经做过实例验证过,的确如此哦!
- Shell变量和数组使用详解
daizj
linuxshell变量数组
Shell 变量
定义变量时,变量名不加美元符号($,PHP语言中变量需要),如:
your_name="w3cschool.cc"
注意,变量名和等号之间不能有空格,这可能和你熟悉的所有编程语言都不一样。同时,变量名的命名须遵循如下规则:
首个字符必须为字母(a-z,A-Z)。
中间不能有空格,可以使用下划线(_)。
不能使用标点符号。
不能使用ba
- 编程中的一些概念,KISS、DRY、MVC、OOP、REST
dcj3sjt126com
REST
KISS、DRY、MVC、OOP、REST (1)KISS是指Keep It Simple,Stupid(摘自wikipedia),指设计时要坚持简约原则,避免不必要的复杂化。 (2)DRY是指Don't Repeat Yourself(摘自wikipedia),特指在程序设计以及计算中避免重复代码,因为这样会降低灵活性、简洁性,并且可能导致代码之间的矛盾。 (3)OOP 即Object-Orie
- [Android]设置Activity为全屏显示的两种方法
dcj3sjt126com
Activity
1. 方法1:AndroidManifest.xml 里,Activity的 android:theme 指定为" @android:style/Theme.NoTitleBar.Fullscreen" 示例: <application
- solrcloud 部署方式比较
eksliang
solrCloud
solrcloud 的部署其实有两种方式可选,那么我们在实践开发中应该怎样选择呢? 第一种:当启动solr服务器时,内嵌的启动一个Zookeeper服务器,然后将这些内嵌的Zookeeper服务器组成一个集群。 第二种:将Zookeeper服务器独立的配置一个集群,然后将solr交给Zookeeper进行管理
谈谈第一种:每启动一个solr服务器就内嵌的启动一个Zoo
- Java synchronized关键字详解
gqdy365
synchronized
转载自:http://www.cnblogs.com/mengdd/archive/2013/02/16/2913806.html
多线程的同步机制对资源进行加锁,使得在同一个时间,只有一个线程可以进行操作,同步用以解决多个线程同时访问时可能出现的问题。
同步机制可以使用synchronized关键字实现。
当synchronized关键字修饰一个方法的时候,该方法叫做同步方法。
当s
- js实现登录时记住用户名
hw1287789687
记住我记住密码cookie记住用户名记住账号
在页面中如何获取cookie值呢?
如果是JSP的话,可以通过servlet的对象request 获取cookie,可以
参考:http://hw1287789687.iteye.com/blog/2050040
如果要求登录页面是html呢?html页面中如何获取cookie呢?
直接上代码了
页面:loginInput.html
代码:
<!DOCTYPE html PUB
- 开发者必备的 Chrome 扩展
justjavac
chrome
Firebug:不用多介绍了吧https://chrome.google.com/webstore/detail/bmagokdooijbeehmkpknfglimnifench
ChromeSnifferPlus:Chrome 探测器,可以探测正在使用的开源软件或者 js 类库https://chrome.google.com/webstore/detail/chrome-sniffer-pl
- 算法机试题
李亚飞
java算法机试题
在面试机试时,遇到一个算法题,当时没能写出来,最后是同学帮忙解决的。
这道题大致意思是:输入一个数,比如4,。这时会输出:
&n
- 正确配置Linux系统ulimit值
字符串
ulimit
在Linux下面部 署应用的时候,有时候会遇上Socket/File: Can’t open so many files的问题;这个值也会影响服务器的最大并发数,其实Linux是有文件句柄限制的,而且Linux默认不是很高,一般都是1024,生产服务器用 其实很容易就达到这个数量。下面说的是,如何通过正解配置来改正这个系统默认值。因为这个问题是我配置Nginx+php5时遇到了,所以我将这篇归纳进
- hibernate调用返回游标的存储过程
Supanccy2013
javaDAOoracleHibernatejdbc
注:原创作品,转载请注明出处。
上篇博文介绍的是hibernate调用返回单值的存储过程,本片博文说的是hibernate调用返回游标的存储过程。
此此扁博文的存储过程的功能相当于是jdbc调用select 的作用。
1,创建oracle中的包,并在该包中创建的游标类型。
---创建oracle的程
- Spring 4.2新特性-更简单的Application Event
wiselyman
application
1.1 Application Event
Spring 4.1的写法请参考10点睛Spring4.1-Application Event
请对比10点睛Spring4.1-Application Event
使用一个@EventListener取代了实现ApplicationListener接口,使耦合度降低;
1.2 示例
包依赖
<p