VUE2项目安装使用less
编辑文章时所使用vue版本
{ "vue": "^2.5.2",}
一、安装less、less-loader和sass-resources-loadernpm install less@3.0.4 less-loader@5.0.0 sass-resources-loader@2.2.5
二、修改build/webpack.base.conf.js配置moduel.exports = { ..., module: { rules: [ ..., { test: /\.less$/, use: ['vue-style-loader', 'css-loader', 'less-loader'] } ] }}
三、修改build/util.js配置// 修改已有的generateLoadersfunction generateLoaders(loader, loaderOptions) ...
webstorm配置vue+element开发环境
1. 设置启动环境新建npm,Name可以自定义一个名字,script选择启动项目的指令
2. 处理element-ui标签提示unknown的问题File –> settings –> Languages & Frameworks –> JavaScript –> Libraries
3. 处理webstorm不识别@路径别名的问题在 Languages & Frameworks –> Webpack中配置webpck.base.conf.js
4. 处理webstorm使用scss变量提示Element ‘–color-primary’ is resolved only by name without use of explicit imports 的问题File –> settings –> Editor –> Inspections –> Sass/SCSS –> 取消Missing import的勾选
JS将任意格式的时间转为Date对象
/** * 将任意格式的日期转为 new Date() 类型 * @param {*} date 日期 * @param {boolean} allowNull 转换结果是否允许为null * @returns*/function convertAnyToDate(date, allowNull = false) { let dateType = Object.prototype.toString.call(date); // 传入的时间的类型 let timeObj = null; // 时间对象 // 获取时间对象 if (dateType == "[object Date]") { timeObj = new Date(date); } else if (dateType == "[object String]") { // 判断是否为纯数字,纯数字即视为时间戳 let ...
JS判断数据是否为空
使用Object.prototype.toString判断数据的类型
function isEmpty(val){ let valType = Object.prototype.toString.call(val); let isEmpty = false; switch (valType) { case "[object Undefined]": case "[object Null]": isEmpty = true; break; case "[object Array]": case "[object String]": try { isEmpty = val + "" === "null" || val + "" === "undefined" || val.length <= 0 || val.split("&quo ...
JS校验VIN码,生成虚拟VIN码
定义需要使用到的一些常量/** VIN码允许使用的字符数组 */const CharArray = ['1', '2', '3', '4', '5', '6', '7', '8', 'A', 'B', 'C', 'D', 'E', 'F', 'G', 'H', 'J', 'K', 'L', 'M', 'N', 'P', 'R', 'S', 'T', 'V', 'W', 'X', 'Y'];/** 国标规定的VIN码的 ...
CropperJS中文文档(翻译自Cropper.js原英文文档)
Cropper.js
JavaScript image cropper.
官网
Photo Editor - Cropper.js的高级示例。
jquery-cropper - Cropper.js 的 jQuery 插件包装器。A schematic diagram for data’s properties
目录
快速上手
配置
方法
事件
无冲突
支持的浏览器
相关项目
快速上手npm安装npm install cropperjs
CDN:
<link href="/path/to/cropper.css" rel="stylesheet"><script src="/path/to/cropper.js"></script>
cdnjs 为 Cropper.js’s 的CSS 和JavaScript提供CDN支持. 你可以点击这个链接.
开始使用基础用法new Cropper(element[, options])
element
Type: HTMLIm ...
使用electron-vue时遇到的问题及解决
1. 安装yarn及本地模块依赖推荐使用管理员进行安装(win10右击开始栏windows选择Windows PowerShell(管理员))npm install --global yarnnpm install -g node-gypnpm install --global --production windows-build-tools
2. 创建electron-vue项目// 创建项目vue init simulatedgreg/electron-vue my-project// 安装依赖(有条件可通过科学上网进行安装,否则有些地方会卡住)cd my-projectyarn // 或者 npm installyarn run dev // 或者 npm run dev
3. 运行项目时遇到的问题3.1. process is not defined在.electron-vue/webpack.renderer.config.js和.electron-vue/webpack.web.config.js文件中找到HtmlWebpackPlugin代码段并更改为如下代码:new H ...
JS调起APP,没有app则跳转至应用市场
HTML<div class="container"> <div id="btn_download" class="card-btn card_item"> 立即下载 </div></div><div class="mask" @click="hide"> <ol> <li>点击右上角</li> <li>浏览器打开</li> </ol></div>
JS方法// 点击事件document.querySelector('#btn_download').onclick = function () { toApp();}// 调起APP function toApp() { var btn_download = document.g ...
vue + tinymce上传图片到七牛以及图片批量上传
此文基于之前博文vue使用tinymce5富文本编辑器图片批量上传插件来自Tinymce5 ax多图片批量上传插件一、上传图片到七牛云1.安装图片上传以及图片批量上传插件import "tinymce/plugins/image";import "tinymce/plugins/axupimgs";
2.在toolbar和plugins中使用这两个插件,使用自定义图片上传方法plugins:"image axupimgs",toolbar:"image axupimgs"
3.在data中存入七牛云所需的数据data:function{ return { QiniuData: { key: "", //图片名字处理 token: "" //七牛云token }, domain: "http://upload.qiniup.com", // 七牛云的上传地址 ...
VScode更新后安装vetur仍无法格式化vue文件
1.删除 C:\Users\Administrator中的.vscode文件夹2.重新安装vscode3.安装vetur插件,此时可以正常使用