require

React+Webpack快速上手指南

扶醉桌前 提交于 2019-12-06 11:49:45
前言 这篇文章不是有关React和Webpack的教程,只是一篇能够让你快速上手使用目前这两种热门技术的前端指南,并假设你对两者有一个基本的认识。如果你想先行了解下React,可以放肆的移步至 React官方教程 ,如果你已经使用了其他的模块加载与资源打包技术,不妨也来看看 Webpack 提供的思路。 webstorm+react+webpack 强烈推荐使用webstorm!。(当然你完全可以使用诸如atom,Sublime之类的编辑器,但之所以选择webstorm是因为它默认支持对react JSX 的语法高亮以及可以手动开启Emmet对jsx的支持,棒棒哒~) 首先请这么组织你的项目结构: --your project |--app |--components |--productBox.jsx |--main.js |--build |--index.html |--bundle.js(该文件是webpack打包后生成的) 用npm安装react、webpack 默认已经安装了nodejs,并输入: npm init 根据提示输入内容并创建package.json文件 然后依次输入: npm install react --save-dev npm install webpack --save-dev 安装最新版本的React与Webpack并将它们保存至package

js 报错 Uncaught TypeError: Cannot read property 'trim' of undefined

时光毁灭记忆、已成空白 提交于 2019-12-06 10:02:49
常见 Uncaught TypeError: Cannot read property 'trim' of undefined 报错原因及解决方案 $.trim() 函数用于去除字符串两端的空白字符。 未加载相关模块,或者说未正确引入jquery等 常见于模块化开发(seajs,requirejs等等) 例: var $ = require('zepto'); var $ = require('jquery'); var $ = layui.$; <script type="text/javascript" src="jquery.js"></script> 解决方法:引入相应模块或文件即可。 来源: https://www.cnblogs.com/sirdong/p/11975513.html

Does requiring a gem load everything, including things I don't use?

不打扰是莪最后的温柔 提交于 2019-12-06 09:52:34
Assume x is a gem, that contains both Hello and Goodbye classes. If I write a program that require 'x' , but only uses the Hello class. Is the Goodbye class loaded as well? knut You include scripts or files, not gems. With require 'x' you load the file x.rb . Which x.rb you load is defined by the search path, the search pathes can be modified by gem definitions (what you didn't use in your example code). Everything inside the file x.rb is loaded. If x.rb contains other require commands, those files are also loaded. 来源: https://stackoverflow.com/questions/10001106/does-requiring-a-gem-load

被迫使用了坑爹sea.js后如何改造jquery插件

倖福魔咒の 提交于 2019-12-06 08:16:14
// jquery-plugin-abc define( function ( require , exports , module ) { var $ = require ( ' $ ' ); // 插件的代码 $.fn . abc = function () {}; }); 包括bootstrap.js在内, 都需要这样的包裹 详情见 https://github.com/seajs/seajs/issues/971 来源: oschina 链接: https://my.oschina.net/u/579683/blog/525040

electron中JS报错:require is not defined的问题解决方法

筅森魡賤 提交于 2019-12-06 07:53:26
Electron已经发布了6.0正式版,升级后发现原来能运行的代码报错提示require is not defined 解决办法: 修改创建BrowserWindow部分的相关代码,设置属性webPreferences.nodeIntegration为 true let win = new BrowserWindow({ webPreferences: { nodeIntegration: true } }) 在原有的new BrowserWindow基础上加入 webPreferences: { nodeIntegration: true } 就可以了。 来源: https://www.cnblogs.com/nayek/p/11969762.html

vue 卡片轮播 中间大两边小 复制代码就可使用

[亡魂溺海] 提交于 2019-12-06 05:32:34
vue开发中遇到类似原生这种卡片轮播,中间大两边小的需求 网上搜了下,很多都是修改前一个和后一个的高度,然后设置了margin-top,但个人感觉这样病不能保证很好的居中,在研究了官网的demo后,发现 https://www.swiper.com.cn/demo/240-effect-coverflow.html 这个很好,可以实现需求,而且比网上那种那更好些。 1.安装swiper cnpm install --save-dev swiper@3.4.2 (此处注意不要使用 npm install swiper,安装4.x的版本会在ie和某些手机的浏览器显示白屏 ) 2.页面的代码 <template> <div class="swiper-container"> <div class="swiper-wrapper"> <div class="swiper-slide" v-for="(item,index) in images" :key="index"> <img class="swiper-img" :src="item" /> </div> </div> </div> </template> <script> import Swiper from "swiper" import 'swiper/dist/css/swiper.min.css' export

vue导航栏自定义设置带图片(选中状态刷新不消失)

廉价感情. 提交于 2019-12-06 04:09:13
转载自https://blog.csdn.net/wang1006008051/article/details/78686451?utm_source=blogxgwz6 Vue导航栏 用Vue写手机端的项目,经常会写底部导航栏,我这里总结一套比较方便实用的底部导航栏方法,并且可以解决浏览器刷新选中状态消失的问题。也可以选择自适应屏幕。看一下效果,底部的图标全是UI给的选中和未选中样式的图片,根据公司要求, 你也可能会用fontsize去写 。(全部代码黏贴到本文的最后面了) 1、首先把这些小图片放到src/assets路径下面(自动base64编码) 2、在data()里边定义一个选中对应的变量isSelect,和循环遍历的数组,数组下面放图标对应的文字,和选中,未选中的图片地址。 注意:图片的地址不要直接写,直接写就是字符串,不仅会出现显示不出图片的情况,而且打包之后,还是这里地址,不会变。使用webpack提供的require引入图片地址就可以解决以上问题。 data () { return { isSelect: '首页', nav: [ {title: '首页', url: require('../../assets/common/首页@2x.png'), url_one: require('../../assets/common/首页_active@2x.png')},

VUE—底部导航路由切换时更换图片(图文)

点点圈 提交于 2019-12-06 03:16:23
VUE—底部导航路由切换时更换图片 第一步: 布局 给每个底部导航路由都绑定一个点击事件,不要绑定在router-link上,那样会不生效,并且动态的添加图片路径 v-for也行,那样需要动态的绑定方法,可参考 v-for时动态绑定函数 <mt-tab-item> <router-link to="/Home"> <div @click="homeFn"> <img :src="homeUrl" alt=""> <p>首页</p> </div> </router-link> </mt-tab-item> <mt-tab-item> <router-link to="/Discover"> <div @click="discoverFn"> <img :src="discoverUrl" alt=""> <p>发现</p> </div> </router-link> </mt-tab-item> <mt-tab-item> <router-link to="/Photo"> <img src="@/assets/img/photo.jpg" alt=""> </router-link> </mt-tab-item> <mt-tab-item> <router-link to="/Message"> <div @click="messageFn"> <img :src=

win7安装composer

生来就可爱ヽ(ⅴ<●) 提交于 2019-12-06 01:52:40
安装composer 1. 在Composer官网里下载 Composer-Setup.exe 2. 一键式安装,Settings Check选择php.exe的地址 Proxy Settings不需要填 验证composer 打开DOS窗口,输入composer,有下界面的图形则成功 使用composer 需要使用composer在项目下加入QueryList包 在项目目录下新建composer.json { "require": { "guzzlehttp/guzzle": "6.2.*", "jaeger/g-http": "^1.1", "monolog/monolog": "1.2.*", "jaeger/querylist": "^4.0", "jaeger/querylist-rule-baidu": "^4.0" } } 使用DOS进入到项目目录下,执行composer install,会出现vendor文件夹和composer.lock文件 如果已执行过composer install,需要新增QueryLlist则可以使用下边的方法 在composer.json里添加 "jaeger/querylist": "^4.0" 并执行composer update 或者直接执行 composer require jaeger/querylist 来源: https:/