- 博客(81)
- 资源 (4)
- 收藏
- 关注
原创 Vue js引用警告 “export ‘default‘ (imported as ‘xxx‘) was not found
问题原因:ES6 编译器识别问题如果在public.js这样写会有警告export ‘default’ (imported as ‘xxx’) was not foundexport const myMixin= {}解决办法:修改组件中引用js的地方//将 import Public from './public'//改成 import * as Public from './public'...
2021-12-03 13:44:43
5494
原创 Koa 中 引入koa-static处理静态资源
一、问题: 大家都知道在HTML中有三种使用CSS的方式,分别是:内联样式、内部样式、外部样式。外部样式,在head部分使用link标签引入外部写入css样式表的文件,示例如下:,同时,在项目根目录下创建index.css文件,并写入样式。修改后我们刷新页面,发现页面背景色没有变成绿色, 不仅如此,我们在标签里引入一张图片。发现不仅引入的外部样式表不起作用,图片也同样无法正常显示。这是为什么呢? 当然,我们不能光想,而是要去分析,我们打开chrome浏览器的开发者模式,在右侧找到 network并点
2021-11-01 19:04:15
3173
转载 React支持dart-scss
背景node-sass下载速度慢,甚至下载报错。本地编译速度慢。而官方极力推荐使用Dart-sass,Dart运算速度快、易于安装所以希望在React项目中使用dart-scss。使用步骤:命令行安装yarn add dart-sass安装成功后将css文件后缀修改为scss,结果报错告知使用node-scss。查了一下才知道React只支持node-scss不支持dart-scss。于是google上输入create react app dart sass搜索研究,在github的crea
2021-09-10 10:58:25
374
原创 electron跨域配置
我们在使用 electron 时,有时候接口本身是有跨域的,而 electron 本身默认是禁止跨域请求的网上有文章提出在 .electron-vue 文件夹中的dev-runner.js里增加代理 const server = new WebpackDevServer( compiler, { contentBase: path.join(__dirname, '../'), quiet: true, proxy: {
2021-09-02 15:24:32
5156
转载 nextJs:内置scss配置
首先 确保本地有sassnpm i sass --save由于nextJs有内置sass,所以只用在配置next.config.js里面打开即可const path = require('path')module.exports = { sassOptions: { includePaths: [path.join(__dirname, 'styles')], },}全局scss引入:在_app.js 中引入:import '../styles/ab.scss'如果s
2021-08-06 16:56:45
1366
原创 如何在CentOS 7上安装Yarn
先决条件开始学习本教程之前,请确保您以具有sudo权限的用户身份登录。在CentOS上安装Yarn要在CentOS 7系统上安装Yarn,请执行以下步骤:如果您尚未在系统上安装 Node.js ,请使用以下 curl命令启用[Nodesource]存储库:curl --silent --location https://rpm.nodesource.com/setup_10.x | sudo bash -通过输入以下内容安装Node.js软件包:sudo yum install nodejs
2021-08-06 10:33:16
2784
原创 The engine “node“ is incompatible with this module
在使用yarn install安装的时候,提示The engine “node” is incompatible with this module解决办法:运行命令yarn config set ignore-engines true即可解决,亲测有效
2021-08-06 10:25:11
2274
1
原创 部署Node.js环境(CentOS 7)
本教程介绍如何在安装了CentOS 7.2系统的ECS实例上,安装Node.js并部署项目。前提条件用于连接ECS实例的机器上已安装PuTTY。下载地址:PuTTY。已注册阿里云账号。如还未注册,请先完成账号注册。背景信息Node.js是一个基于Chrome V8引擎的JavaScript运行环境,用来方便快速地搭建易于扩展的网络应用。Node.js使用了一个事件驱动、非阻塞式I/O的模型,使其轻量又高效,非常适合运行在分布式设备的数据密集型的实时应用。Node.js的包管理器npm,是全球最大的
2021-08-06 10:24:06
546
原创 Next.js获取路由参数及styled-jsx 的使用
2021-07-22pages目录在Next.js中路由的概念是pages下的文件目录即是路由层级,文件即是路由如下:直接在根目录下的pages文件夹下,新建一个jsyang.js页面,启动后 访问路径为/jsyang// pages ---路由文件// _app.js ---启动文件,不走路由// _document.js ---宿主文件,不走路由// a.js
2021-07-22 19:04:46
2859
1
原创 nvm安装node成功,npm失败问题2021-07-20
nvm一般的安装路径: C:\Users\用户名\AppData\Roaming\nvm找到后修改settings.txt之后再卸载掉原来版本的node,然后再重新安装即可//卸载原来版本的nodenvm uninstall 16.5.0//重新安装 16.5.0 版本的nodenvm install 16.5.0//验证是否安装上nvm listnode -vnpm -vnpx -v...
2021-07-20 15:51:42
635
原创 Editor.md图片上传获取不到图片地址2021最新
Editor.md图片上传获取不到图片地址,Editor.md图片上传ifream最近项目中要支持markdown 编辑器,现在基本做技术的没有不知道Markdown 的,因为实在是太强大了,只需要了解很简单的几个操作,即可编辑非常优美的文章,包括TeX科学公式(基于KaTeX)、流程图 Flowchart 和 时序图 ,不在让你浪费时间在格式的调整。背景是在PC端使用,直接引入JQuery和Markdown.md插件进行使用资源:Editor.mdeditor.md的githubeditor
2021-07-17 10:12:07
1118
4
原创 关于前端埋点
为什么要埋点?现在的互联网公司越来越关注转化、新增、留存,而不是简单的统计PV、UV。而完整的数据采集是一切的前提。埋点包括在IOS、Android、H5、小程序等前端埋点,也包括后端业务埋点。这里仅仅讲讲这些年和产品经理、运营撕逼上百个回合的前端埋点内容。说说手工埋点、可视化埋点、无埋手动埋点(代码埋点)纯手动写代码,调用埋点SDK的函数,在需要埋点的业务逻辑功能位置调用接口上报埋点数据,友盟、百度统计等第三方数据统计服务商大都采用这种方案;手动埋点让使用者可以方便地设置自定义属性、自定义事件。
2021-07-15 08:27:48
4051
1
原创 nodejs之koa2 --KOA安装 202107
KOA安装koa 依赖node V7.6.0及以上版本,首先确认node版本在7.6.0以上,版本低的请自行升级。npm init // 初始化package.jsonnpm i koa // 安装koa2安装完成之后,在项目根目录下创建一个app.js,内容如下:const Koa = require('koa');const app = new Koa();app.use(async (ctx) => { ctx.body = 'hello koa2'});app
2021-07-12 13:28:20
415
原创 Node Sass could not find a binding for your current environment: OS X 64-bit with Node.js 12.x 2021
[本文日期:2021年7月6日]使用node 版本 12,node-sass 安装的版本是4.14.1,react版本为"react": “^17.0.2”,安装之后报错 Node Sass could not find a binding for your current environment: OS X 64-bit with Node.js 12.xerror in ./node_modules/vue-loading-spinner/src/components/RotateSquar
2021-07-06 09:59:43
5288
原创 在vsCode中react中写html不会自动补全
在vsCode中react中写html不会自动补全20210705自动补全的方法:文件 — 首选项 ----设置搜索 includeLanguages,找到这个点击到settings.json文件点击添加项,将 "javascript": "javascriptreact" 添加进去即可如果搜索设置搜索到的是json文件,则按照如下规则添加"emmet.includeLanguages": { "javascript": "javascriptreact" }就可以在reac
2021-07-05 17:05:20
768
1
原创 react中点击事件带参数会立即执行2021-07-05
react中点击事件带参数会立即执行2021-07-05环境:本次使用版本为"react": “^17.0.2”之前的版本也有同样的问题,点击事件存在该问题,其他事件同理;问题代码如下,用该种方式写点击事件则页面初始化的时候就会执行该事件import './App.css';const App = () => { const btnAction=(a)=>{ console.log(this,a++); } return ( <div classNa
2021-07-05 15:46:40
357
原创 阿里云服务器升级openssl1.1.1k 2021-07最新
CentOS6默认openssl版本是2013年发布的1.0.1,这里,我们需要升级到2021发布的openssl 1.1.1k版本。最新稳定版为1.1.1系列。这也是我们的长期支持 (LTS) 版本,支持到 2023 年 9 月 11 日。所有旧版本(包括 1.1.0、1.0.2、1.0.0 和 0.9.8)现在都不再支持,不应使用。鼓励这些旧版本的用户尽快升级到 1.1.1。可以通过下面的地址下载之后,通过FTP工具上传到服务器下载地址:openssl-1.1.1k.tar.gz总结:莫要在网上一
2021-07-02 10:08:24
1250
原创 2021-06 MAC下安装Anaconda并支持Conda命令
这里写自定义目录标题下载Anaconda并安装下载Anaconda并安装macOS系统安装Anaconda① 图形界面安装前往官方下载页面下载。有两个版本可供选择:Python 3.6 和 Python 2.7,我下载的是前者。选择版之后点击“64-Bit Graphical Installer”进行下载。完成下载之后,双击下载文件,在对话框中“Introduction”、“Read Me”、“License”部分可直接点击下一步。“Destination Select”部分选择“Insta
2021-06-24 00:40:38
814
1
原创 2021-06最新亲测CentOS-7下安装Redis的详细过程
2021-06最新亲测CentOS-7下安装Redis的详细过程查看最新安装包地址安装redis所需的必要包下载redis安装包redis启动方式直接启动后台启动修改redis.conf文件写redis启动脚本设置开机自启拷贝Redis启动文件并修改。设置为开机自启动设置环境变量启动/关闭redis服务查看最新安装包地址网上搜索直接复制的可能因为时间久远而版本有所变化,不如自己查找最新或稳定的包使用,官网地址[redis官网下载]https://redis.io/download通过审查元素获得最新包
2021-06-23 10:54:12
334
原创 去掉html标签的js
<script> function delHtmlTag(str){ return str.replace(/<[^>]+>/g,"");//去掉所有的html标记 }var str = "<span style='display:none;'>This is test</span><img src=''>ss</img><strong></strong><br/>";str = .
2021-06-13 21:23:50
135
原创 react Hooks+axios+antd+TypeScript,简单实现接口请求loading效果
文件后缀为tsx发送请求时showLoading(), 请求失败hideLoading()import ReactDOM from 'react-dom';import axios from 'axios';import Qs from "qs";import {Spin} from "antd";const Axios = (url:string,method:any='get',params:{}={}, isAuth:boolean=false)=>{ const Base
2021-05-27 16:08:59
428
原创 2021年最新web前端面试题及答案:JS基础知识专题
JavaScript面试题相关专题本章节面试题与JavaScript相关,以专题形式推出便于各个击破。2021年最新web前端面试题及答案:HTTP/HTML/浏览器专题2021年最新web前端面试题及答案:CSS相关专题说一下闭包(1)什么是闭包: 闭包是指有权访问另外一个函数作用域中的变量的函数。 闭包就是函数的局部变量集合,只是这些局部变量在函数返回后会继续存在。闭包就是函数的“堆栈”在函数返回后并不释放,我们也可以理解为这些函数堆栈并不在栈上分配而是在堆上分配。当在一个函数内定义另外一个函
2021-05-20 10:01:45
2476
原创 2021年最新web前端面试题及答案:CSS相关专题
CSS相关专题本章节面试题与CSS相关,以专题形式推出便于各个击破。2021年最新web前端面试题及答案:HTTP/HTML/浏览器专题说一下 css 盒模型CSS 中的盒子模型包括 IE 盒子模型和标 准的 W3C 盒子模型。CSS 盒模型本质上是一个盒子,封装周围的 HTML 元素,它包括:边距,边框,填充, 和实际内容。标准盒模型:一个块的总宽度=width+margin(左右)+padding(左右)+border(左右)怪异盒模型:一个块的总宽度=width+margin(左右)(既
2021-05-19 20:59:45
1621
原创 2021年最新web前端面试题及答案:HTTP/HTML/浏览器专题
HTTP/HTML/浏览器本章节面试题与HTTP/HTML/浏览器相关,以专题形式推出便于各个击破。说一下 http 和 httpshttps 的 SSL 加密是在传输层实现的。(1)http 和 https 的基本概念http: 超文本传输协议,是互联网上应用最为广泛的一种网络协议,是一个客户端和服 务器端请求和应答的标准(TCP),用于从 WWW 服务器传输超文本到本地浏览器的传 输协议,它可以使浏览器更加高效,使网络传输减少。https: 是以安全为目标的 HTTP 通道,简单讲是 HTT
2021-05-19 19:27:07
1323
原创 SWR 用于数据请求的 React Hooks 库
SWR用于数据请求的 React Hooks 库“SWR” 这个名字来自于 stale-while-revalidate:一种由 HTTP RFC 5861 推广的 HTTP 缓存失效策略。这种策略首先从缓存中返回数据(过期的),同时发送 fetch 请求(重新验证),最后得到最新数据。使用 SWR,组件将会不断地、自动获得最新数据流。UI 也会一直保持快速响应。概览:import useSWR from 'swr'function Profile() { const { data, e
2021-05-19 08:53:35
604
原创 React项目中 ESLint对a标签href属性警告解决方法
警告描述:The href attribute is required for an anchor to be keyboard accessible.Provide a valid, navigable address as the href value.If you cannot provide an href, but still need the element to resemble a link, use a button and change it with appropriate s
2021-05-19 08:45:31
3109
原创 前端面试题:输入url地址按下回车发生了什么?
URL简介:通常最简单的url,就像这样:https://www.ycsnews.com/,这串url就包含方案(就是通信协议,常见的http,https),服务器地址(www.ycsnews.com),端口号(http协议默认是80端口,https协议默认是443端口,https就是加密的http协议,就是在http和TCP之间加了一层TSL或者SSL的安全层),资源(默认是index.html,跟服务器配置有关)。1.输入url地址后,首先进行DNS解析,将相应的域名解析为IP地址;1.第一次访问某
2020-07-17 18:07:34
1950
原创 前端面试必会题:var与let、const的区别
一、var声明的变量会挂载在window上,而let和const声明的变量不会:var a = 100;console.log(a,window.a); // 100 100let b = 10;console.log(b,window.b); // 10 undefinedconst c = 1;console.log(c,window.c); // 1 undefined二、var声明变量存在变量提升,let和const不存在变量提升console.log(a);
2020-07-16 17:23:00
432
原创 使table表格横向和垂直滚动
想要table表格垂直滚动,加点CSS即可循环合并表头本文使用框架为 Vue<template> <div class="pages-tables" id="pages-tables" style="overflow-x:scroll;"> <table class="table table-bordered" id="table" c...
2019-11-07 18:05:54
1004
原创 解决React中刷新页面redux数据丢失
为什么要存储react-redux中的数据?当页面刷新之后,redux中的数据会回到初始值,之前存储到redux中的数据也就不复存在了。废话不多说,直接上代码:在reducer文件中:let shopDetailInfo = sessionStorage.getItem(‘shopDetailInfo’)?JSON.parse(sessionStorage.getItem(‘shopDeta...
2019-10-16 16:56:04
5330
1
原创 React 页面中插入图片/React页面中设置背景图
React 页面中插入图片React 页面中设置背景图网上看好多都不能用,正确的做法:backgroundImage: "url(" + require("../imgs/bg_pc.jpg") + ")"只要是在页面中,直接加载图片资源都要使用 require...
2019-09-23 16:29:06
5940
3
原创 symfony4 创建并连接数据库操作(2)[2019]
symfony4 数据库查询从数据库中取回对象更加容易。例如,假设您已配置路由以Product根据其id值显示特定的路径:public function showAction($productId){ // $productId 为传递的参数 $product = $this->getDoctrine() ->getRepository(Product:...
2019-09-03 21:35:05
561
原创 React 中使用CSS的几种方式
第一种: 在组件中直接使用style不需要组件从外部引入css文件,直接在组件中书写。import React, { Component } from "react";const div1 = { width: "300px", margin: "30px auto", backgroundColor: "#44014C", //驼峰法 minHeight: "200px"...
2019-08-22 16:23:05
1411
原创 React脚手架create-react-app2.0搭建项目
环境准备要提前安装好node、npm或者cnpm、webpack,本机使用 node 为当前最新版 10.16.0 版本。如果安装多版本 node 可以使用nvm 进行管理。查看环境命令传送门create-react-app 是来自于 Facebook,通过该命令我们无需配置就能快速构建 React 开发环境。create-react-app 自动创建的项目是基于 Webpack + ES...
2019-08-21 21:20:00
428
原创 vue-cli + webpack + Browsersync 进行移动端的同步调试
准备工作在使用脚手架安装 Vue 项目的时候,首先要安装好,node.js、npm 或 cnpm、webpack,可以使用以下命令进行查看并确认是否安装// 查看 node 版本$ node -v// 查看 npm 版本$ npm -v// 查看 cnpm 版本$ cnpm -v安装使用脚手架安装 vue 项目,安装脚手架:// 脚手架安装npm install -g v...
2019-08-20 20:16:56
770
原创 symfony4 创建并连接数据库操作(1)[2019]
更新时间:2019-08-16symfony4 配置数据库配置文件在项目的根目录下的 .env 文件中配置好关键的数据库连接信息. 找到 DATABASE_URL 这行, 和普通的数据库连接配置一样.# 修改mysql连接信息.DATABASE_URL="mysql://db_user:db_password@127.0.0.1:3306/db_name"# 如果使用Sqlite数...
2019-08-16 15:48:26
1625
原创 symfony4 安装和创建项目[2019]
symfony4 安装和创建项目symfony4 安装启动symfony4 项目symfony4框架项目目录symfony4 的命令行新的改变功能快捷键合理的创建标题,有助于目录的生成如何改变文本的样式插入链接与图片如何插入一段漂亮的代码片生成一个适合你的列表创建一个表格设定内容居中、居左、居右SmartyPants创建一个自定义列表如何创建一个注脚注释也是必不可少的KaTeX数学公式新的甘特图功...
2019-08-15 19:22:11
1020
原创 Laravel 5.6 创建全局公共函数
Laravel 5.6 创建全局公共函数@TOC一、需求我在使用 Laravel 进行项目逻辑处理的时候要加载一些方法,需要全局调用这个方法又必须得是一个全局函数,因此需要给 Laravel 创建全局的公共函数二、实现1、创建文件在 app 创建文件夹 Helpers,并且在其中创建文件 functions.php2、自动加载由于 5.5 之后, bootstrap/autoloa...
2019-02-19 16:08:42
174
原创 Android Studio 无法预览xml布局视图的解决办法
提示:failed to load AppCompat ActionBar with unkNown error现象,如图: 解决办法:在AndroidManifest.xml文件中找到 全局样式文件 Theme,如图: 1、找到 AndroidManifest.xml 文件 2、找到 主题文件并打开 android:theme=”@style/AppTheme” 3、修改 ...
2018-06-23 13:58:51
2194
原创 In order to use Instant Run with this device running API 26, you must install platform API 26 in you
下载一个demo运行提示处理方法:as - setting 在搜索里面输入SDK 把8.0 的下载即可运行
2018-06-22 09:24:58
1018
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人