胖达的博客-优快云博客

原创 vscode编辑器设置，禁止prettier/禁止Vetur自动格式化HTML代码

添加以下代码："vetur.format.defaultFormatter.js": "prettier", //.vue文件template格式化支持，并使用js-beautify-html插件 "vetur.format.defaultFormatter.html": "js-beautify-html", //js-beautify-html格式化配置，每行80字符属性换行 "vetur.format.defaultFormatterOptions": ...

2021-09-09 10:08:10 6473

原创 docker启动Tomcat容器成功，访问404！

查看已经启动的容器$ docker ps使用8888端口访问Tomcat失败先查看防火墙状况$ service firewalld status如果防火墙没关闭，先关闭防火墙$ service firewalld stop防火墙关闭时，防火墙的状态如下：确定防火墙关闭但访问Tomcat还是失败之后，使用如下命名进入Tomcat的目录确定防火墙关闭但访问Tomcat还是失败之后，使用如下命名进入Tomcat的目录$ docker exec -it dafc8d

2021-05-10 15:40:16 333

原创 Docker 的安装

Docker 的安装Docker是一个开源的商业产品，有两个版本：社区版（Community Edition，缩写为 CE）和企业版（Enterprise Edition，缩写为 EE）。企业版包含了一些收费服务，个人开发者一般用不到。下面的介绍都针对社区版。Docker CE的安装请参考官方文档，我们这里以CentOS为例：1、Docker要求 CentOS 系统的内核版本高于3.10通过uname -r 命令查看你当前的内核版本# uname -r查看操作系统版本# cat

2021-05-10 15:36:49 385

原创 Vue2.0/3.0双向数据绑定的实现原理

Vue2.0/3.0 双向数据绑定的实现原理双向数据绑定简意即数据的改变能让页面重新渲染Vue2.0 ES5的原理：Object.defineProperty 对数据进行拦截<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial.

2021-04-28 16:41:00 264

原创 vue 动态路由从而实现控制权限管理

router文件夹下的index.js是项目总路由入口，index.js对模块注册后默认将constantRoutes无权限的路由增加进去，在store/modules/permission.js中维护静态+动态路由权限，并在根目录下的permission.js实现导航守卫逻辑，在/router/index.js中：import VueRouter from 'vue-router';//constantRoutes 是静态路由，不需要动态权限判断export const const

2021-04-15 12:25:17 3054 1

原创 VUE 中 mock的简单使用

安装mockjsnpm install mockjs --save-dev 在项目中创建mock/index.js，并写一个简单的返回示例// 引入mockjsimport Mock from 'mockjs'// 引入模板函数类import ratings from './ratings'// Mock函数const { mock } = Mock// 设置延时Mock.setup({ timeout: 400})// 使用拦截规则拦截命中的请求，mock(url, po

2021-04-13 10:11:03 171

原创 VUE项目打包后文本溢出代码消失问题

打包时必须使用这种方法打包，否则打包后-webkit-box-orient: vertical 便会消失网上解决方案是这样的，但是我在我的项目中发现不起作用，解决方案optimize-css-assets-webpack-plugin这个插件的问题注释掉webpack.prod.conf.js中下面的代码new OptimizeCSSPlugin({ cssProcessorOptions: config.build.productionSourceMap ? { sa..

2021-01-12 19:14:14 370

原创 vue 启动报错

because it violates the following Content Security Policy directive: "default-src 'none'". Note that 'img-src' was not explicitly set, so 'default-src' is used as a fallback.只要修改config/index.js : dev: { assetsPublicPath: '/', //修改成这样}...

2020-10-14 23:07:13 770

原创 webpack 3.x 升级 webpack 4.x Vue项目打包速度(体积)优化步骤

①happypack多线程执行webpack执行预处理文件时单线程的，我们可以使用happypack来多线程处理文件。安装npm i happypack -S -D 修改./build/webpack.base.js文件const HappyPack = require('happypack');const os = require('os');const happyThreadPool = HappyPack.ThreadPool({ size: os.cpus().length

2020-08-03 14:25:13 506

原创 Dva + React + Mock 搭建项目（主要讲解DvaJs）

一、初始化dva1、安装 dva-cli$ npm install dva-cli -g$ dva -vdva-cli version 0.9.12、创建新应用安装完 dva-cli 之后，就可以在命令行里访问到dva命令。现在，你可以通过dva new创建新应用。$ dva new dva-quickstart这会创建dva-quickstart...

2020-02-28 18:16:46 1221 2

原创 vue配置网页授权登录第一步，配置授权地址

微信网页授权文档：https://mp.weixin.qq.com/wiki?t=resource/res_main&id=mp1421140842微信网页授权分4步：这里只讲第一步，就是如何配置授权地址第一步：用户同意授权，获取code在确保微信公众账号拥有授权作用域（scope参数）的权限的前提下（服务号获得高级接口后，默认拥有scope参数中的snsapi_ba...

2019-05-31 11:04:50 3472 2

原创 vue升级Webpack4后打包的css背景图片路径错误

webpack4升级之后对于css的打包需要用到mini-css-extract-plugin替换掉之前webpack3版本的extract-text-webpack-plugin插件。之前css静态打包对于背景图片需要的是在build文件夹内的utils.js文件中更改为if (options.extract) { return ExtractTextPlugin.extract({ ...

2019-04-26 17:33:08 1411

原创微信小程序请求加签名验证（MD5）

第一步：创建request.jsconst Promise = require('es6-promise').Promiseconst util = require('./util.js');const utils = util.default.util.prototype;//签名参数这个两个参数是后台给的const key = 'cdbbf90ec69b7f9df6ff...

2019-01-29 16:41:51 6766 1

原创 vue vue-cli 不同的环境打包不同的接口地址

由于项目需要使用webpack构建的工程，在开发过程中不同环境的配置不同，在各种环境的打包切换过程中需要手动修改相关配置达到预期目的。比较麻烦，所以借鉴别人方法写了不同环境打包分类配置。打包配置文件基本就是这样一个项目的开发调试过程肯定不止开发环境和生产环境，由于缺少环境常量，开发人员常常需要手动修改请求Api域名，进而导致如果项目存在多个环境时，多出的环境没办法自动化构建。...

2018-11-21 14:20:17 3462 2

原创 vue+vue-cookie 微信授权登录

基本实现思路是：无论使用哪个url进入网站都会先触发router.beforeEach钩子在router.beforeEach钩子中判断用户当前登录状态若没有登录则保存用户进入的url并跳转到login授权页面 login授权页面完成微信授权以及isLogin(用户登录状态)的写入实现用户登录获取前面保存的用户进入url并跳转1、首先安装 vue-cookie...

2018-11-16 16:04:49 2594 1

原创 Vuex全局状态管理的简单用法

一、安装npm install --save vuex//注意要带save二、在src新建一个文件夹vuex，然后再新建一个store.js文件import Vue from 'vue'import Vuex from 'vuex'Vue.use(Vuex) const store = new Vuex.Store({ //全局调用变量 stat...

2018-10-19 12:01:40 471

原创基于mpvue微信小程序 promise+wx.request 封装请求

第一步：在微信小程序中引入es6-promise如果是基于mpvue框架进行微信小程序开发，只需要npm install es6-promise第二步：在项目中创建一个utils文件夹，主要用来装一些用到的工具然后再utils下面创建一个requet.jsconst Promise = require('es6-promise').Promisefunctio...

2018-10-18 17:22:50 2377

原创 vue+axios+promise 封装请求

axios特点1.从浏览器中创建 XMLHttpRequests2.从 node.js 创建 http 请求3.支持 Promise API4.拦截请求和响应（就是有interceptor）5.转换请求数据和响应数据6.取消请求7.自动转换 JSON 数据8.客户端支持防御 XSRF 安装axios和qsnpm i axios --save引入axiosim...

2018-10-18 17:04:46 21060 3

胖达的博客