1、首先是babel在转换js时将js的语法分为了两部分一部分是语法，一部分是api，语法可以根据环境配置来转换，而api则需要安装特定的插件。
提到 exports 和 module.exports 我们不得不提到 require 关键字。大家哦读知道 Node.js 遵循 CommonJS 规范，使用 require 关键字来加载模块。
babel 是一个 JS、TS 的编译器，它能把新语法写的代码转换成目标环境支持的语法的代码，并且对目标环境不支持的 api 自动 polyfill。
在解决了一番js的问题之后，和产品进行了一波对接，说是界面过于丑陋，于是针对界面和模块，进行了一定程度的自定义。勉强能看之后，就下班了。第二天发现，后台奇慢无比，每操作一次，就会进行有关于admin.js和layui.js的报错，附带两条，index与admin模块不存在的提示。但后台操作是可以正常操作的，前端不受任何影响。
网上关于babel7的文章很多，但是大多都没有实践，很多讲的模棱两可。 本文将手把手的带你看各种配置下的输入输出转换，彻底让你了解babel7到底该怎么去配置和优化。
主要是判断是否是在qiankun中打开是否渲染，以及导出qiankun生命周期需要的方法。
在前面系列文章提到，webpack 实现中，原始的资源模块以 Module 对象形式存在、流转、解析处理。
修改 CRA 项目的配置使用 create-react-app 创建的项目默认是无法修改其内部的 webpack 配置的，不像 vue-cli 那样可以通过一个配置文件修改。 虽然有一个 eject 命令可以是将配置完全暴露出来，但这是一个不可逆的操作，同时也会失去 CRA 带来的便利和后续升级。
注意：使用Thymeleaf的引用方法，只有运行项目才有效。普通打开HTML无法解析。
1 背景 相信对于每个刚接触构建的同学来说， webpack 都是难以跨越的一道坎，它凭着抽象的概念、“言简意赅” 的文档，难倒了一众英雄好汉。 由于自己平时从零手写 webpack 配置的机会比较少，所以对 webpack 里的一些配置不都是特别清楚。 最近的一个需求需要给页面资源增加 md5 版本号，我正好借着这个机会，把项目里的 webpack 配置都重新梳理了一遍。 本文对于基本的配置概念（如 entry 、 output 等）就不一一赘述了，着重介绍的是 splitChunks 和 manifes
在vue项目里面，我们在js里面要获取页面的标签里面的东西，我们不用原生的js语句，我们可以在页面的标签上加一个ref属性，写法如下
原文地址：https://dev.to/bhagatparwinder/strict-mode-in-javascript-4ge4
如果我们对所有的代码进行合理的拆分，将首屏和非首屏的代码进行剥离，将业务代码和基础库代码进行拆分，在需要某段代码的时候再加载它，下次若再需要用则从缓存中读取...
前言 在http1的时代，比较常见的一种性能优化就是合并http的请求数量，通常我们会把许多js代码合并在一起，但是如果一个js包体积特别大的话对于性能提升来说就有点矫枉过正了。而如果我们对所有的代码进行合理的拆分，将首屏和非首屏的代码进行剥离，将业务代码和基础库代码进行拆分，在需要某段代码的时候再加载它，下次若再需要用则从缓存中读取，一来可以更好地使用浏览器缓存，再者就是可以提高首屏加载速度，很好提升用户的体验。 核心思想 业务代码和基础库的分离 这个其实很好理解，业务代码通常更新迭代很频繁，而基础库通常
MVC设计模式基本思想就将项目层次分解为Model(模型层)、View(视图层)、Controller(控制层)。
打包工具帮你获得一些准备用于部署的js和css等，把它们转化为适合浏览器的可用的格式。
video.js是一个很好的视频播放插件，但是如果移植到vue上相信很多小伙伴很苦恼，是不是网上搜了一堆，发现不好使，我也是踩坑了，后来发现官方文档上就有，好尴尬，建议以后学习先看看官方文档，会有惊喜的。 1.首先安装video.js，然后在main.js中引入
运行测试的时候，报了这一堆的错误Uncaught TypeError: Cannot read property 'dialog' of undefined”
在前面的学习中，我们一直使用webpack-dev-server充当（本地）服务器和完成打包任务，但是当出项目团队联合开发，共同使用一个服务器时，这时候我们需要实时进行打包以确保团队间能进行联调或者进行相关代码的合并工作时，每次保存后手动打包显然效率太低，我们需要的是代码发生变化后，只要保存，webpack自动为我们进行打包。这就得谈到本节中说到的watch工具了。
今天终于得空了，我要把 kui 说明文档这个项目优化下。打开太慢了，就是这个 http://k-ui.cn
或许是HTTP2普及的时候。但更大的可能是将来也“不能用”（还是只能在构建工具中用，仅存在于“编译期”）
由于本人也是初入angular2不久,很多问题也许解决了,确不知其原由,也有一些问题,解决了后面又出来同样的错误,关于这些,请谅解. 关于这个问题,我自己也是想了很久,总算是能用上了, 想在angular2中引用jquery的话,高大上的一个方法是,在package.json中的dependencies中写入,执行cnpm i;安装; "dependencies": { "@angular/common": "^4.0.0", "@angular/compiler": "^4.0.0",
这是之前在公司oa项目优化时罗列的优化点，基本都已经完成，当时花了点心思整理的，保存在这里，方便以后其他项目用到查漏补缺。 1、打包文件中的app.js文件放入cdn，加快页面首次加载速度 2、提取公共方法，减少js代码量 3、提取公共组件，将统计分析的售前和售后，客户分配，客户管理，客服管理等页面的搜索条件模块化，减少了html代码量，减少了每个页面中都有的重复方法。 4、vue-router路由全部改成懒加载路由，该页面被点开时才加载该页面.vue组件，提高首页加载速度。 5、根据页面复杂度，删除
上一章我们基本上领略了three.js的魅力，这一章我们先不急着深入three.js，先学习2个非常有用的工具库，分别是stats.js和dat.gui，也许你没有听过两个库，但是很可能你见过他们。
1.3 对于一些插件，如果只是在个别组件中用的到，也可以不要在 main.js 里面引入，而是在组件中按需引入
Vue 中使用 jQuery 和 Bootstrap 不是特别符合 Vue 原生的写法，但是有时候又要用，所以放上我的引入设置，供大家参考。
在大家的日常开发中，特别是开发大型项目，大家有没有每次打包想要骂娘的冲动！反正我是很痛苦，每次打包20分钟起，这漫长的等待时间，让人非常焦虑，遇见一些特殊问题（比如测试微信分享），必须要打包部署，看效果，你会发现，一天时间全部浪费在打包上，真所谓改代码两分钟，打包代码两小时，于是闲暇之余，研究了一下webpck打包机制，并且通过几个小插件和一些技巧成功的减少公司项目的打包时间，虽然打包时间没有断崖式的减少，但是能少一分钟，是一分钟吧，下面我们一起来研究一下webpack的性能优化，以及体积优化！
我进入项目组后参加了第一次项目会议，在会议上项目经理为每个项目成员都分配了任务，我的任务是使用GoJS实现一个拖拽效果，这也是我第一次听说GoJS，在网上查阅相关的资源后发现GoJS的资料比较少，而且绝大多数资源都是英文的，这也为我学习及使用这个框架带来了不小的困难，好在项目经理看出这块做起来比较难后来又加了一个人，现在这块由我和一个同事两个人共同开发。
Web前端作为开发团队中不可或缺的一部分，需要按照相关规定进行合理编写（一部分不良习惯可能给自己和他人造成不必要的麻烦）。不同公司不同团队具有不同的规范和文档。下面是根据不同企业和团队的要求进行全面详细的整理结果。备注：实际开发请以本公司的规范为标准。
首先第一点就是babel的三个核心包：@babel/core、@babel/cli、@babel/type。
该项目为提供微信小程序一套便捷好用动画执行方案， 通过添加简单的动画类名和一些简单的参数，即可实现想要的动画效果。灵感来源 WOW.js
Vue.js是一个渐进式、基于MVVM设计模式的纯前端JavaScript框架。它可以与其他技术混用，适用于以数据操作为主的项目，无需依赖后端技术。下面是关于Vue.js的一些重要知识点整理：
Babel在目前前端领域类似一座山一样的存在，任何项目或多或少都有它的身影在浮现。
前言 如果你想使用ES6模块语法管理代码，又不想使用webpack这个重型工具； 如果你只是想简简单单的写个js、html、css，不需要typescript、postcss等高级工具； 如果你想开发时所见到的错误就像使用script标签引入的脚本一样清晰； 如果你想上线代码只打包成一个或几个文件以减少文件体积和连接数； 那么，你可以继续往下读了。 特点 1、轻盈易用，几个文件，数百行代码，只需要开启其nodejs服务即可使用ES6模块语法编写代码，无需Babel转译； 2、方便排错，浏览器展示代码与本地j
我们都知道JS的新的API，语法糖层出不穷，在丰富了我们的知识库的同时，也极大的便利了我们的开发。
规范目的 为提高团队协作效率, 便于后台人员添加功能及前端后期优化维护, 输出高质量的文档, 特制订此文档. 本规范文档一经确认, 前端开发人员必须按本文档规范进行前台页面开发. 本文档如有不对或者不合适的地方请及时提出, 经讨论决定后方可更改. 基本准则 符合web标准, 语义化html, 结构表现行为分离, 兼容性优良. 页面性能方面, 代码要求简洁明了有序, 尽可能的减小服务器负载, 保证最快的解析速度. 文件规范 1. html, css, js, images文件均归档至<系统开发规范>约定的目录
前面chapter11介绍了js的代码分割，本章说下css的代码分割如何弄。 git仓库：webpack-demo 1、开始 前面chapter11章讲CodeSplitting的时候已经讲过代码分割的概念了，是个什么东西，但那是对js模块做代码分割，这节说下css的代码分割。 主要借助的就是一个插件：MiniCssExtractPlugin，还是沿用我们以前的代码，我们先来安装一下。 $ cd chapter13 $ npm install mini-css-extract-plugin --sa
无论是日常业务架构、前端框架设计甚至在前端面试过程中，一定会存在 Babel 的身影。
有过开发经验的同学都知道，为使代码层次结构清晰分明，对于一些通用或常用的方法，都会将其抽象成公共方法或配置供使用者调用。
1， vue 提供了注入机制，就是把我们的store 对象注入到根实例中。vue的根实例就是 new Vue 构造函数，然后在所有的子组件中,this.$store 来指向store 对象。在store.js 中，我们let store, 把store已经暴露出去了，new Vue() 在main.js中，所以直接在main.js 中引入store 并注入即可。
我们在使用Hexo框架生成静态博客时，其实是将你写好的.md文件输出成HTML文件进行渲染，其中HTML的文件名称就是.md的文件名称。
知识付费使用 script 标签引入 Vue.js。在项目中也可以使用组件，完成一些公共业务。以 H5 登录弹窗为例，对在知识付费中使用组件进行说明。
echarts是一款不错的商业级数据图表，目前已更新到echarts3版本，但是由于历史原因，echarts2仍然有比较大的使用占比，之所以讲echarts2的引入方式是因为项目在混合使用echarts2与echarts3的时候遇到了一个问题，这个与我之前写过的一篇文章有关：http://blog.csdn.net/john1337/article/details/54947787，下面入主题。
作者：海因斯坦，原文链接：https://juejin.im/post/6893809205183479822
默认情况下，经过 Webpack 打包后的模块资源会被组织成一个个函数形式，例如：
ES6关于导入和导出,其自带了模块化，我们可以直接作用import和export在浏览器中导入和导出各个模块了， 导入导出的功能是模块化,使你的js功能独立,另外我们通过不定向导出和定向导入,使各个js不再必须使用闭包的方式封装代码,而是引入了类似于对象的概念的感觉使内容具有唯一性,当然也利于代码解耦,提高代码的复用性.
领取专属 10元无门槛券
手把手带您无忧上云
云服务器
ICP备案
实时音视频
对象存储
即时通信 IM
