vue
Week.D.Awn
人云亦云,并不会让你变得有多优秀,而会让你越来越随大流。
展开
-
前端代码规范神器之f2elint的使用教程
日常开发中,项目基本上都是由多个人进行开发和维护,每个人的代码书写习惯和风格又不尽相同,commit的提交信息也是杂乱无章,为以后的开发和维护增添了很多困难。F2ELint是《阿里巴巴前端规约》的配套Lint工具,可以为项目一键接入规约、一键扫描和修复规约问题,保障项目的编码规范和代码质量。安装好后无需配置,插件会自动找到项目中的.eslintrc.js、.stylelintrc.js、.prettierrc.js等配置文件,到此为止,就可以正常使用【阿里巴巴前端规约】来规范自己的项目了。......原创 2022-07-28 10:24:26 · 2150 阅读 · 0 评论 -
prettier常用配置项
代码】prettier常用配置项。原创 2022-07-27 14:24:00 · 1993 阅读 · 0 评论 -
使用vue+iview Form组件, 按enter键导致页面刷新的解决方案
vue 按 enter导致页面刷新的解决方案原创 2022-06-13 15:47:51 · 2004 阅读 · 1 评论 -
基于 xterm + websocket + vue 实现网页版终端 terminal
基于 xterm + websocket + vue 实现网页版终端 terminal原创 2022-06-09 14:41:43 · 8676 阅读 · 4 评论 -
vue移动端适配方案 - px 自动转 rem
1.安装lib-flexibleyarn add lib-flexible2.引入lib-flexible# src/main.tsimport 'lib-flexible/flexible'3.安装postcss-pxtoremyarn add lib-flexible4.在根目录下新建 postcss.config.js# project_name/postcss.config.jsmodule.exports = { plugins: { // 兼容浏览器,原创 2022-04-06 16:43:51 · 2698 阅读 · 1 评论 -
vue3路由模式为history,打包后页面空白的处理方式
场景vue-router 的 hash 模式时,url始终待着’#‘,如’http://localhost:8080/#/index.html’。如果要去掉’#'号,那么就需要把 vue-router 的 hash 模式改为 history(html5)模式。# vue3const router = createRouter({ //hash 模式 // history: createWebHashHistory(), //html5 模式 history: createWeb原创 2022-04-06 16:42:22 · 7535 阅读 · 0 评论 -
前端模块化详解
一、背景作为前端开发,模块化我们已经耳熟能详,我们平时接触到的 ES6 的 import,nodejs中的require他们有啥区别?我们也听过CommonJS、CMD、AMD、ES6模块系统,这些都有什么联系呢?本文将对这些问题进行归纳总结,可以对模块化有个清晰的认识。二、为何需要模块化?1. 起源最开始 js 是没有模块化的概念的,就是普通的脚本语言放到 script 标签里,做些简单的校验,代码量比较少。随着ajax的出现,前端可以请求数据了,做的事情更多了,逻辑越来越复杂,就会出现很多原创 2022-04-06 16:24:22 · 501 阅读 · 0 评论 -
前端项目中 cookie、sessionStorage 和 localStorage的详细用法
一.cookie的使用1.首先加载模块npm i js-cookie -S2.在使用cookie的页面上进行引入import Cookies from 'js-cookie'3,使用方法创建一个在整个网站上有效的CookieCookies.set('name', 'value');创建一个从现在起7天后过期的cookie,在整个站点上有效:Cookies.set('name', 'value', { expires: 7 });创建一个过期的cookie,对当前页面的路径有效:原创 2022-01-10 16:47:01 · 1199 阅读 · 0 评论 -
vue-cli3中缺少的vue.config.js的配置项
module.exports = { // 基本路径 baseUrl: process.env.NODE_ENV === 'production' ? './' : './', // 输出文件目录 outputDir: 'dist', // 默认dist // 用于嵌套生成的静态资产(js,css,img,fonts)目录 // assetsDir: '', // 指定生成的 index.html 的输出路径 (相对于 outputDir)。也可以是一个绝对路径 indexPath: 'in原创 2021-11-25 16:32:27 · 2069 阅读 · 0 评论 -
设置vue-video-player视频铺满不留黑边
::v-deep .video-js .vjs-tech { object-fit: fill;}::v-deep .vjs-poster { background-size: cover;}原创 2021-11-19 11:12:25 · 1908 阅读 · 4 评论 -
vue中为每个vue-router跳转的页面设置单独的页面title
一般来说,如果不对vue中新打开的页面进行设置,会默认使用首页的title作为新打开的vue页面title。对vue-router跳转到的页面设置单独的页面title,分为如下2步:在src中的router的index.js文件中对需要单独设置页面title的路由,增加meta属性,在meta里面新增页面的title名字属性:具体代码: { path: '/:pathMatch(.*)*', component: () => import(/* webpackChun原创 2021-11-18 10:16:24 · 1544 阅读 · 0 评论 -
vue切换页面/路由跳转后,页面不会置顶的解决方案
场景:使用vue-router组件,进行页面切换,切换后的页面滚动条还停留在上一级页面的位置,没有置顶。需求:每次跳转新页面时,都置顶显示。解决方案:在vue的router目录下的index.js文件中进行配置://修改前const routes = []...const router = new VueRouter({ routes,})//修改后const routes = []...const scrollBehavior = (to, from, savedPosit原创 2021-10-14 14:46:47 · 3507 阅读 · 2 评论 -
vue3.x项目中使用jquery(最简单的方式)
因为最近的项目需求,要把vue从2.x升级到3.x。项目中用到了jquery,网上搜索出来的使用方法都是vue2.x的方式:修改webpack.base.conf.js文件,或者修改vue.config.js。然而vue3.x的版本中根本就没有这两个文件。这种方式已经不再适用了。没必要再去新建一个文件。具体的引入方式如下:安装jquerynpm install jquery -S在项目的main.js中声明const $ = require('jquery');window.$ = $原创 2021-09-09 15:14:50 · 7128 阅读 · 4 评论