browserify

模块化

心已入冬 提交于 2020-12-23 03:11:04
1,什么是模块化? 模块化是指将一个复杂的系统分解为多个模块,方便编码。 2,为什么要用模块化? 降低复杂性,降低代码耦合度,部署方便,提高效率。 3,模块化的好处? a,避免命名冲突,减少变量空间污染 b,更好的分离代码,按需加载 c,更高复用性 d,更高可维护性 模块化实现 1,函数形式 2,命名空间形式 3,立即执行函数 4,模式增强 模块化规范 1,CommonJs 2,AMD 3,CMD 4,Es6 CommomJs 据CommonJs规范规定每一个Js文件都可以看作一个模块,其内部定义的变量是属于这个模块的,不会对外暴露,也就是说不会污染全局变量。该规范最初 用在服务器端的node环境中 。 CommonJS采用 同步加载 不同模块文件,适用于服务器端的。因为模块文件都存放在服务器的各个硬盘上,读取加载时间快,适合服务器端,不适应浏览器。 浏览器不兼容CommonJs ,原因是浏览器缺少module、exports、require、global四个环境变量。如要使用需要工具转换。 CommonJS的核心思想 就是通过 require 方法来同步加载所要依赖的其他模块,然后通过 exports 或者 module.exports 来导出需要暴露的接口。 案例: exports是导出,require引入,最后通过 http://browserify.org/

electron 自己注册回调 hook

眉间皱痕 提交于 2020-10-15 04:00:31
electron 中webview如何与主进程渲染进程进行事件监听通信 zpzxgcr 2018-10-12 23:26:35 1006 收藏 展开 直接上代码 const webview = document.querySelector('webview'); webview.addEventListener('dom-ready', () => { webview.openDevTools(); console.log('渲染进程在webview加载完之后发送消息') }) //上面是渲染进程发送消息给webview webview.addEventListener('ipc-message', () => { console.log('收到webview发送的消息'); }) webview也就是网页这么接收 if ( window.require('electron') ) { let ipcRenderer = window.require('electron').ipcRenderer; ipcRenderer && ipcRenderer.on('webmsg', (e, msg) => { console.log(msg,'收到的消息'); }); ipcRenderer && ipcRenderer.sendToHost('我已经收到消息了'); } /

Vue JS - Rendering Multiple Instances of Components

纵然是瞬间 提交于 2020-08-10 07:18:26
问题 Development Environment: First, I am using Vue 1.0 and Vueify 7.0.0 using the latest node. js, npm and browserify to compile the code on an Ubuntu machine with a local Apache Server. The Problem: I have created a custom component for <form-input/> which renders without an error. However, when trying to place them next to each other only one will render: <form> <form-input /> <form-input /> <form-input /> </form> In order to get multiple components to render I have to wrap each one in it's own

《前端开发从入门到放弃》

北战南征 提交于 2020-08-08 11:14:09
去年看到一篇文章 是写前端更新迭代的新技术,今天无意间又看到原创人翻译过来的文章啦 。这里贴下来 给大家灌一碗毒鸡汤 嘿,我最近接到一个 Web 项目,不过老实说,我这两年没怎么接触 Web 编程,听说 Web 技术已经发生了一些变化。听说你是这里对新技术最了解的 Web 开发工程师? 准确地说,我是一名「前端工程师」。不过你算是找对人了。我对今年的技术别提多熟了,前端可视化、音乐播放器、能踢足球的无人机,你尽管问吧。我刚去 JS 大会和 React 大会逛了一圈,没有什么新技术是我不知道的。 厉害。是这样的,我要开发一个网页,用来展示用户的最新动态。我想我应该通过后端接口获取数据,然后用一个 table 来展示数据,用户可以对数据进行排序。如果服务器上的数据变化了,我还需要更新这个 table。我的思路是用 jQuery 来做。 可别用 jQuery!现在哪还有人用 jQuery。现在是 2016 年了,你绝对应该用 React。 哦,好吧,React 是什么? React 是一个非常厉害的库,Facebook 的牛人写的。它能让页面更可控,性能极高,而且使用起来很简单。 听起来确实不错。我能用 React 展示服务器传来的数据吗? 当然可以,你只需要添加两个依赖,一个是 React,一个是 React DOM 额,等下,为什么是两个库? React 是我说的库,React

How to get babelify 10 to target a browser

大憨熊 提交于 2020-07-09 11:55:06
问题 What I want is To be using the latest versions of the libraries. For it to run in IE 11. I'm building a react app and in order to run the tests I need @testing-library/react. In order to run the tests in a browser I need browserify. In order to run the tests in every browser I support I need babelify. However no matter what I try the babelify does nothing (and IE 11 doesn't support ... or => syntax it generates). Here's the relevant part of package.json (some dependencies are likely not

Require file with a variable in React JS

孤街醉人 提交于 2020-06-12 02:45:07
问题 I'm trying to require a file with a variable in the path. Something like const langCode = this.props.langCode; // en let languageFile = require('../common/languages/' + langCode); Where langCode can be fr, en, de, nl. Thus what I'm trying to get is for example require('../common/languages/en'); When I type it without variable at the end, thus require('../common/languages/en'); it works good. But when I try with require('../common/languages/' + langCode); it won't work, doesn't matter that the