Skip to content

Instantly share code, notes, and snippets.

View zzjtnb's full-sized avatar

争逐 zzjtnb

11 followers · 12 following
View GitHub Profile
@zzjtnb
zzjtnb / npm run dev 自动打开浏览器
Last active September 15, 2020 07:14
运行npm run dev 自动打开浏览器
打开项目中的/config/index.js
修改
```js
autoOpenBrowser: false,
```
为
```js
autoOpenBrowser: true,
```
保存重新运行该项目即可
@zzjtnb
zzjtnb / 去掉Vue项目启动后首页URL带的#
Last active September 15, 2020 07:20
去掉Vue项目启动后首页URL带的#
对于vue开发的单页面应用，我们在切换不同的页面的时候，可以发现html永远只有一个，这也真是称之为单页面的原因，而vue-router 默认 hash 模式 —— 使用 URL 的 hash 来模拟一个完整的 URL，于是当 URL 改变时，页面不会重新加载。因为对于正常的页面来说，更换url一定是会导致页面的更换的， 而只有更换url中的查询字符串和hash值得时候才不会重新加载页面。 这里也就是这个道理。
　但是#这种形式真的很丑！ 所以，如果不想要，可以使用路由的history模式！！！ 这种模式充分利用了history.pushState API来完成URL的跳转而不需要重新加载页面。
```js
const router = new VueRouter({
mode: 'history',
routes: [...]
})
@zzjtnb
zzjtnb / 使用symbol方式引入项目的iconfont资源
Last active September 15, 2020 07:21
引入iconfont资源
symbol引用
这是一种全新的使用方式, 应该说这才是未来的主流, 也是平台目前推荐的用法. 相关介绍可以参考这篇文章 这种用法其实是做了一个svg的集合, 与上面两种相比具有如下特点:
支持多色图标了, 不再受单色限制.
通过一些技巧, 支持像字体那样, 通过font-size, color来调整样式.
兼容性较差, 支持 ie9+, 及现代浏览器.
浏览器渲染svg的性能一般, 还不如png.
使用步骤如下:
第一步: 拷贝项目下面生成的symbol代码:
@zzjtnb
zzjtnb / 前端资源
Last active March 29, 2019 07:58
百度网盘
第一套
[密码: 2cjs](https://pan.baidu.com/s/1ONDFO2Bpl7aZjiaWDfNNCQ )
第二套
[密码: 6uvi](https://pan.baidu.com/s/117P8Wd1H2TPczsqgdQgCkw )
vue
[密码:97p0](https://pan.baidu.com/s/1ftcGm973Vznd0QwIyiAq5A)
@zzjtnb
zzjtnb / git初始化本地仓库提交操作说明
Last active September 15, 2020 07:24
git操作命令
git关联仓库、拉取代码、提交代码完整流程
====
1. 本地项目上传到github上指定项目地址
在项目里面打开点击右键
``` bash
git bash here
```
@zzjtnb
zzjtnb / linux下node.js和npm升级
Last active September 15, 2020 07:29
指令
linux下node.js和npm升级
====
# Node
# Node.js的开发非常活跃, 它的最新稳定版本也频繁变化, 你不时会发现, 一个模块不能在你当前的Node版本上使用, 此时你需要升级Node
# 幸运的是, 可以用一种非常简单的方法来管理你的Node版本, 即使用Node Binary管理模块"n".
## 1. 检查 Node的当前版本, 使用命令
@zzjtnb
zzjtnb / 搭建vue开发环境教程
Last active September 15, 2020 07:30
搭建vue开发环境
vue-cli 是一个官方发布 vue.js 项目脚手架, 使用 vue-cli 可以快速创建 vue 项目, GitHub地址是:https://github.com/vuejs/vue-cli
一、 安装 node.js
``` js
首先需要安装node环境， 可以直接到中文官网http: //nodejs.cn/下载安装包。
只是这样安装的 node 是固定版本的， 如果需要多版本的 node， 可以使用 nvm 安装[npv](http: //blog.csdn.net/s8460049/article/details/52396399)
安装完成后， 可以命令行工具中输入 node - v 和 npm - v， 如果能显示出版本号， 就说明安装成功。
```
@zzjtnb
zzjtnb / CSS完美实现iframe高度自适应（支持跨域）
Last active June 15, 2018 08:28
CSS实现iframe高度自适应（支持跨域）
Iframe的强大功能偶就不多说了，它不但被开发人员经常运用，而且黑客们也常常使用它，总之用过的人知道它的强大之处，但是Iframe有个致命的“BUG”就是iframe的高度无法自动适应，这一点让很多人都头疼万分。百度或是谷歌一下，确实很多解决方法，但尝试一下，会发现问题很多：浏览器兼容性差，不能自适应，仅支持同域Iframe等诸多问题，尤其是跨域Iframe高度自适应问题。网上根本找不到一种可行的方案（唯一有一种提到加入代理页面的，经过测试发现无用）。难道真的没有一种可行的解决方案了吗？ No，下面和大家分享一种强大的方法，代码如下：
```html
<html>
<head>
<style>
body {
margin-left: 0px;
margin-top: 0px;
margin-right: 0px;
@zzjtnb
zzjtnb / 常用CSS基本指南
Last active September 15, 2020 07:33
css
```css
1. CSS基本属性
字体属性：(font)
大小：{font-size: x-large;}(特大) xx-small;(极小) 一般中文用不到，只要用数值就可以，单位：PX、PD
样式 ：{font-style: oblique;}(偏斜体) italic;(斜体) normal;(正常)
行高：{line-height: normal;}(正常) 单位：PX、PD、EM
@zzjtnb
zzjtnb / 浏览器跨域访问解决方案
Last active September 15, 2020 07:36
浏览器跨域访问解决方案
**跨域的概念**
跨域大家都知道, 不同地址, 不同端口, 不同级别, 不同协议都会构成跨域. 例如:about.haorooms.com和www.haorooms.com都会构成跨域. 总结起来只要协议、域名、端口有任何一个不同, 都被当作是不同的域. 下面举例, 每两个一组.
``` bash
URL 说明 是否允许通信
http://www.haorooms.com/a.js
http://www.haorooms.com/b.js 同一域名下 允许
http://www.haorooms.com/lab/a.js