使用Electron进行桌面端开发时的热加载方案
执行下面的npm命令安装electron-reloader。慢的话使用cnpm吧，安装成功后，package.json内容会自动修改。 #安装electron-reloader npminstall--save-develectron-reloader #package.json内容自动修改如下 { #package.json会自动增加devDependencies这项 "devDependencies":{ "electron":"^9.1.0", "electron-reloader":"^1.0.1" } } 需要我们操作的一步就是在main.js（Electron项目入口文件）文件中增加如下代码： #main.js文件修改 const{app,BrowserWindow}=require('electron') //热加...[>>…]
使用Electron进行win桌面端的开发
想试试桌面端的开发，但又不想去接触C#、WPF之类的语言，了解了一下，Electron是一个可以开发桌面端软件又和web开发有点关系的方案，Electron是由Github开发，基于Chromium和Node.js，使用JavaScript、HTML和CSS等Web技术创建跨平台原生桌面应用的框架。兼容Mac、Window和Linux，它构建的应用可在这三个操作系统上面运行，借助Electron，我们可以使用纯JavaScript来调用丰富的原生APIs。 Electron的开发环境搭建，我这里是Windows10，需要安装的环境包括Python、node...[>>…]
在ubuntu好部署jenkins发布vue项目时遇到的一些问题及解决方法
1.问题：webpack-dev-server不是内部或外部命令，也不是可运行的程序解决：使用webpack要安装webpack-cli这个包，才可以调用webpack和webpack-dev-server这些命令。 npminstallwebpackwebpack-dev-serverwebpack-cli--save-dev 2.webpack——Error:Cannotfindmodule'extract-text-webpack-plugin'解决：在项目目录下依次执行 #全局安装npminit： npminit-y-g #全局安装webpack： npminstallwebpack-g npminstallwebpack--save-dev-g #全局安装extract-text-webpack-plugin： npminstall--saveextract-text-webpack-pl...[>>…]
Layui的form表单登录js提交代码及服务端的处理
Layui的form表单提交的很多处理写到了其自有的js逻辑中，需要注意的一项是如果使用js中的逻辑来进行提交的话，html部分中的登录button按钮需要写成button。不然会在js处理后仍然页面提交。Layui的form表单提交的js代码及服务端的处理代码示例如下： <!--表单登录html部分--> <formmethod="post"class="layui-form"> <inputname="username"placeholder="用户名"type="text"lay-verify="required"class="layui-input"> <hrclass="hr15"> <inputname="password"lay-...[>>…]
使用npm搭建VUE项目全过程
1.基础node环境和IDE的安装 vue项目的基础环境包括开发环境及IDE，IDE之前有篇文章记录：http://www.04007.cn/article/784.html安装VScode即可。开发环境需要安装node.js。vue.js开发为什么要安装node.js呢？准确的说是使用vue-cli搭建项目的时候需要nodejs。vue本身并不完全需要node.js。VUE同样可以像一个JS文件直接引入.html的script中来使用，但通过使用node使开发更方便，并能方便打包部署，解析vue单文件组件和vue模块，启动测试localhost,管理vue-router，vue-resource插件等。所以推...[>>…]
Bootstrap中自适应布局的一些设置
Boostrap本身就是一个响应式自适应的前端UI框架。使用栅格模式后，其自适应功能也能很好的运用。根据浏览器宽度的大小，Boostrap有四种栅栏类名提供使用，用法与Css样式表类名选择器样式调用是一样的：xs：col-xs-1~col-xs-12，多列始终在一行内。sm：col-sm-1~col-sm-12，多列在浏览器像素宽度大于等于768px时才在一行内。md：col-md-1~col-md-12，多列在浏览器像素宽度大于等于992px时才在一行内。lg：col-lg-1~col-lg-12，多列在浏览器像素宽度大于等于1200px时才在一行内。 &...[>>…]
利用img的usemap属性和css3实现圆形点击区域
css属性实现圆形点击区域有两种方式，一是利用img的usemap属性，二是使用CSS3中相关的border-radius属性。 一、使用img结合map实现。usemap属性提供了一种客户端的图像映射机制，通过特殊的<map>和<area>标签，可以将图片不同的区域映射到不同的链接。示例如下： <!doctypehtml> <htmlclass="notranslate"> <head> <metacharset="UTF-8"/> </head> <bodystyle="padding:100px;"> <imgsrc="test.png"usemap="#cri...[>>…]
Vue开发工具VSCode的安装使用以及nodejs中的npm安装
凭借着免费，开源，轻量，跨平台的特点收货了一大批忠实粉丝，现在使用Vscode作开发IDE的人越来越多，特别是前端开发。VSCode对JavaScript语言、库和Web环境的支持都很好。所有关于react、Vue.js、Electron的教程中也都推荐使用VSCode。 VSCode的安装使用，进入VScode的官网https://code.visualstudio.com/ 点击DownloadforWindows下载安装即可，非常方便。安装完成之后运行IDE进行一下语言选择，有方便的中文语言包支持。方法：使用快捷键:ctrlshift+p打开快速...[>>…]
http请求中的Referrer-Policy策略及应用
在页面调用图片等其它资源时，或者发生页面跳转时，都会向服务端发生一个带Referrer的HTTP请求，这也是一些网站做防盗链的抓手，在ReferrerPolicy策略发面前，浏览器可以按自己的默认规则来决定是否加上Referrer。2014年W3C下Web应用安全工作组（WebApplicationSecurityWorkingGroup）发布了ReferrerPolicy草案，对浏览器发送Referrer做了详细规定。在新的ReferrerPolicy中，可以实现隐藏Referrer，也可以只发送来源URL的host地址（不过不允许伪造）。 新的ReferrerP...[>>…]
Access-Control-Allow-Origin如何同时允许http和https的Origin跨域请求
因为后端在跨域的时候需要前端的cookie信息，因此跨域网站在输出Access-Control-Allow-Origin头信息的时候不能指定为*，但是因为网站请求支持http和https两种方式，而使用不同请求方式的时候传给服务器端的origin头信息内容是不一样的。 如果服务器是直接承接的https请求，443和80端口的配置是分开写的到也好处理，可以直接使用在添加header信息的时候根据当前请求的scheme添加头信息。add_headerAccess-Control-Allow-Origin"$scheme://www.04007.cn"always; &...[>>…]
