程序猿日常

2019/2/26

• import、require、export、module.exports使用详解

webpack本身维护一套模块系统，这套模块系统兼容了前端历史进程下的模块规范，包括amd,commonjs,es6等，本文主要针对 commonjs和es6规范进行说明。模块化的实现其实就是在最后编译的文件内。自执行函数：

(function(modules){  
    
})([])
复制代码

自执行函数的入参是个数组，这个数组包含了所有的模块，自执行函数体里的逻辑就是处理模块的逻辑。

babel专门用于处理es6转换为es5，当然也包括es6模块语法的转换。
babel和webpack的转换思路差不多，区别在于webpack的原生转换可以多做一步静态，分析，使用tree-shaking技术 babel能提前将es6的import等模块关键字转换为commonjs的规范。

es6的导出模块方法有：
 export default 123;
 export const a = 1;
 const b = 2;
 const c = 3;
 export {b, c};
复制代码

babel会将这些统统转换为commonjs的exprots。

exports.default = 123;
exports.a = 1;
exports.b = 2;
exports.c = 3;
exports._esModule = true;
复制代码

babel将模块导出的逻辑非常简单，将所有的输出都赋值exports，并带上一个_esModule表明这个由es6转换来的commonjs输出。
对于最常见的

import a from './a.js'
复制代码

在es6中这个行代码的本意是想去引入一个es6模块中的default输出。

• 修改Element-ui源码自动刷新配置方法：

import ElementUI from './../node_modules/element-ui/src/index.js';  
webpack.base.config.js文件修改babel-loader配置添加：
resolve('node_modules/element-ui')
"transform-vue-jsx",
"transform-es2015-modules-commonjs"都加上前缀babel-plugin-
复制代码

1. css BFC IFC GFC FFC
2. css 常用的核心技巧
3. css 矩阵 css 3d
4. css 与数学魅力
5. css预处理器和后处理器
6. css性能问题 重绘重排 动画 硬件加速
7. css 与黑客安全 跨站脚本攻击
8. psd houdini

• 前端分图形化和架构师两个大方向
• nodejs要学习的重点

1. log4js
2. jmeter + js
3. PM2
4. Nginx配置
5. proxy io
6. promise
7. express koa2

转载于:https://juejin.im/post/5c74b166f265da2dbc599758