vite + vue3 多页面实战优化续集:eslint+lint-staged+husky+stylelint
vite + vue3 多页面实战优化续集:eslint+lint-staged+husky+stylelint
目的:项目投入使用发现很多使用起来不舒服的地方,进行优化
注意!!!:最新的一次创建项目运行时候以及配置eslint部分出现了许多问题
,可以结合最新的一篇vite+vue+ssg做官网 再记录一下项目创建结合起来查看是否有你遇到的问题
前提:在上一篇vite + vue3多页面配置记录references,loadEnv等中我详细记录了通过各种配置了解多页面项目。
结果:最终代码放到gitee这里的release分支vite-vue3-multip-release
之前配置不合理的地方:
为了让项目启动的时候自动打开html,修改了项目根目录到views下面root:'./src/views/'
,以至于outDir,windicss也要改。
所有生成的html全部扎堆生成在views下面,结构混乱
未配置eslint,保存自动格式化
未配置代码提交自动跑eslint检测。使用lint-staged + husky
未配置stylelint,规范css书写
未配置快速生成页面脚本:用plop搞个模版生成index.vue和main.ts,可以直接看代码库代码
项目到实践中肯定是不合理的,用起来不舒服。逐步解决上面的问题
第一步:不修改根目录路径;在根目录新建一个html文件夹,并将生成的html放到根目录统一管理,且要支持多级页面
通过上图目录结构可以看到,src/views
下面有多级页面,最后生成到src同级目录下的html文件夹中,且结构与之对应。这样看起来就很舒服,html文件夹中的东西根本不用动,通过脚本,每次dev的时候自动生成
我们看代码实现,主要还是去修改build/getPage.ts
, 利用mkdirp生成多级文件夹
import glob from 'glob'
import fs from 'fs'
import mkdirp from 'mkdirp'
import { resolve } from 'path'
const input = {}
const mainEntry = []
const iconDirs = []
function getPages () {
// 遍历文件夹中含有main.ts的文件夹路径
const allEntry = glob.sync('./src/views/**/main.ts')
// console.log(allEntry)
// console.log('allEntry', allEntry)
// 创建多页面模板
allEntry.forEach((entry: string) => {
const pathArr = entry.split('/')
const tsName = pathArr[pathArr.length - 2]
pathArr.pop()
const targetFilePath = pathArr.splice(3).join('/')
// 创建多级文件夹,去掉最后一个
const mkdirPath = targetFilePath.replace(`/${tsName}`, '')
const srcArr = entry.replace('./', '')
// console.log(targetFilePath, mkdirPath)
// 判断文件是否存在
try {
fs.accessSync(`./html/${targetFilePath}.html`)
} catch (err) {
if (targetFilePath.includes('/')) {
mkdirp(`./html/${mkdirPath}`).then(() => {
generete(targetFilePath, srcArr)
})
} else {
generete(targetFilePath, srcArr)
}
}
const svgPath = srcArr.split('/')
svgPath.splice(svgPath.length - 1, 1)
// input中的配置
input[targetFilePath] = resolve(`html/${targetFilePath}.html`)
// vconsole用
mainEntry.push(resolve(`${srcArr}`))
iconDirs.push(resolve(process.cwd(), `${svgPath.join('/')}/svg`))
})
};
function generete (targetFilePath, srcArr) {
// 获取模板
const temp = fs.readFileSync('./index.html')
// 多级相对路径
let relativeStr = ''
targetFilePath.split('/').forEach(() => {
relativeStr += '../'
})
console.log(`创建${targetFilePath}.html文件`)
const index = temp.toString().indexOf('
')
const content =
temp.toString().slice(0, index) +
`` +
temp.toString().slice(index)
fs.writeFile(`./html/${targetFilePath}.html`, content, err => {
if (err) console.log(err)
})
}
getPages()
// console.log(input, mainEntry, iconDirs)
export { input, mainEntry, iconDirs }
有了以上代码。每次运行都会根据入口main.ts,生成对应的html。但是启动项目怎么直接打开我想要的index.html呢?
server里面有配置,配置open即可。想到当时仅仅为了启动项目打开入口页面就更改root是多么的不理智了
// vite.config.ts
server: {
open: '/html/index.html',
proxy: {
'/api': {
target: 'https://app-api-0.com',
changeOrigin: true
}
}
},
第二步:配置eslint
这个就比较简单了,网上也有很多教程,当走到教程前面几步就可以了。我这里也记录一下
安装eslint npm i eslint -D
初始化配置:npx eslint --init
然后根据提示一步步操作 2.1 选择模式: (To check syntax and find problems) 我选第三个:To check syntax, find problems, and enforce code style
2.2 (选JavaScript modules): 选第一个:JavaScript modules (import/export)
2.3 选择语言框架 (选Vue.js) 2.4 是否使用ts : 我这里选yes 2.5 代码在哪里运行 (用空格选中 Browser+Node) 2.6 选择一个风格:我选的Standard, 完全就够用了 后面就是yes安装,会发现安装了这些插件
"eslint-config-standard": "^17.0.0",
"eslint-plugin-import": "^2.26.0",
"eslint-plugin-n": "^15.2.4",
"eslint-plugin-promise": "^6.0.0",
"eslint-plugin-vue": "^9.2.0",
"@typescript-eslint/eslint-plugin": "^5.30.7",
"@typescript-eslint/parser": "^5.30.7",
一些教程里面还单独安装@typescript-eslint/parser,我实践中走完上面就已经全部有了,生成的.eslintrc.js也不需要修改。
只是部分规则不适用vue3,我们可以在rules直接关掉即可:比如 vue/multi-word-component-names, no-irregular-whitespace
3.选择性安装vite-plugin-eslint
, 用于配置vite运行的时候自动检测eslint规范,使用npm run dev时会主动检查代码并报错
npm i -D vite-plugin-eslint
使用
import eslint from 'vite-plugin-eslint'
export default defineConfig({
plugins: [
vue(),
eslint()
]
})
setting.json 需要的内容
// setting.json
{
// 重新设定tabsize
"editor.tabSize": 2,
// 每次保存的时候自动格式化
"editor.formatOnSave": false,
"editor.codeActionsOnSave": {
"source.fixAll.eslint": true
}
}
这里提一嘴i18n-ally
多语言翻译这个vscode 插件,好用。
// setting.json中加入
{
"i18n-ally.localesPaths": ["src/views/login/lang"],
"i18n-ally.keystyle": "nested",
"i18n-ally.sortKeys": true,
// pathMatcher 必需开启namespace ,{locale}指的就是翻译文件名"i18n-ally.localesPaths",{ext}就是enabledParsers中的文件后缀
"i18n-ally.namespace": true,
"i18n-ally.pathMatcher": "{locale}/{namespaces}.{ext}",
"i18n-ally.enabledParsers": ["js", "json", "ts"],
"i18n-ally.sourceLanguage": "en",
"i18n-ally.displayLanguage": "zh", // 展示中文
"i18n-ally.enabledFrameworks": ["vue", "react"],
}
主要提这个i18n-ally.pathMatcher路径匹配,多份翻译文件,放在在同一个二级文件src/lang/en
,src/lang/zh
夹就能通过它namespaces匹配到且生效
第三步:配置lint-staged + husky。在git commit 的时候对提交文件进行校验
lint-staged工具对暂存的代码进行 lint,通常都是配配合husky使用. husky帮助你在git操作环节执行lint-staged,也就是里面的 eslint --fix
对暂存的src
下面的文件进行eslint校验。 一般我们会看到如下package.json配置
//package.json
{
"lint-staged": {
"src/**/*.{js,jsx,ts,tsx,vue}": [
"eslint --fix" // 仅仅校验修改暂存的文件
// "npm run lint:eslint". 如果要校验所有文件的也可以,除非你想这么做
]
}
}
//"scripts": {
//"lint:eslint": "eslint --cache --max-warnings 0 \"{src,mock}/**/*.{vue,ts,js,tsx}\" --fix",
// }
通过husky安装参考文档可以发现,安装husky有两种方式,结果是一样的
自动方式,只需要执行一句npx husky-init && npm install
npx husky-init && npm install # npm
npx husky-init && yarn # Yarn 1
yarn dlx husky-init --yarn2 && yarn # Yarn 2+
pnpm dlx husky-init && pnpm install # pnpm
执行完后会在package.json/scripts 自动加上"prepare": "husky install"
, 在根目录生成了一个.husky文件夹,里面有个_pre-commit
脚本文件
#!/usr/bin/env sh
. "$(dirname -- "$0")/_/husky.sh"
npm test
修改npm test
为自己的脚本命令,比如:npx lint-staged
这里的命令修改就可以自由发挥了,只要能触发package.json中的 lint-staged就成 比如我可以在这里写npm run lint:lint-staged
,那package.json/scripts中有对应的命令"lint:lint-staged": "lint-staged"
即可 tip:不走lint-staged,直接在这里写npm run lint:eslint
也是可以的(lint:eslint
是scripts中的eslint --fix命令)。说明仅仅只安装husky也是可以的,那也就是校验所有文件了。配合lint-staged只校验暂存区文件才是最好的
手动方式,按照顺序多执行几个命令
// 先安装
npm i husky -D.
// 先执行这句才能执行有第四句
npx husky install
// 在package.json/scripts 加上`"prepare": "husky install"`。自己手动去加也行
npm set-script prepare "husky install"
// 这句就是在`_pre-commit`脚本文件加上自己的命令啦
npx husky add .husky/pre-commit "npx lint-staged"
以上就能成功了。
第四步:配置stylelint
vscode 扩展必不可少:
通过stylelint官方文档我们先安装三个插件:我项目用的less,多来一个postcss-less
。如果你用scss,来一个postcss-scss
就好,下面配置一样的
npm i stylelint stylelint-config-standard postcss-less -D
新建文件.stylelintignore
/dist/*
/public/*
public/*
新建.stylelintrc.js
。stylelint默认只能识别css文件,我项目使用的less,上面安装一个postcss-less
,使用官网提到的自定义语法customSyntax参数让其能够识别less文件。 如果没有下面配置的overrides/customSyntax
,less文件中会有看不懂的报错:Unknown word (CssSyntaxError)Stylelint(CssSyntaxError)
// .stylelintrc.js
module.exports={
extends:["stylelint-config-standard",],
overrides:[
{
files:["**/*.less"],
customSyntax:"postcss-less"
}
]
}
有了上面的操作,已经能看到less文件中的样式各种红色提示了,还需要保存自动格式化,在.vscode/setting.json中增加下面的内容就可以了。
"editor.codeActionsOnSave": {
"source.fixAll.stylelint": true
}
项目是vue项目,vue文件中的样式无法识别,而且能看到输出的报错信息,提示我要postcss-html
,安装它
在.stylelintrc.js中加入它
module.exports={
extends:["stylelint-config-standard"],
customSyntax: "postcss-html",
overrides: [
{
files:["**/*.less"],
customSyntax:"postcss-less"
}
],
}
这时候你会发现vue文件中样式并没有提示问题。还差一步,在.vscode/settings.json
中增加
"stylelint.validate": ["vue", "less", "css"]
有了以上的简单配置,就可以保存自动按照stylelint格式化你的样式了
升级内容 (1)结合lint-staged,提交检测样式,在package.json中增加
"lint-staged": {
"**/*.{css,less,scss,vue}":[
"stylelint --fix"
]
}
(2)插件帮助我们css按照顺序书写
// 安装插件
npm i -D stylelint-order stylelint-config-rational-order
stylelint-config-rational-order
插件用来简化了插件stylelint-order
的引用和配置。你只用stylelint-order
也是可以的
//.stylelintrc.js 中使用插件
module.exports={
extends:["stylelint-config-standard", 'stylelint-config-rational-order'],
}
下面是一些问题记录
1. 当项目中使用了自动导入unplugin-auto-import/vite插件,eslint会提示ref等不存在
(1) 安装 vue-global-api
(2) 在eslintrc.js中加入它
extends: [
'plugin:vue/vue3-essential',
'standard',
'vue-global-api'
],
2. 记录一下cross-env,cross-env 使用单个命令,而不用担心环境变量的设置
安装
npm i cross-env -D
使用
"report": "cross-env REPORT=true npm run build",
取参数
const isReport = process.env.REPORT === 'true'
isReport
? visualizer({
//生成的stats放到别的地方去
filename: './node_modules/.cache/visualizer/stats.html',
open: true,
gzipSize: true,
brotliSize: true
})
: [],
3. 项目中加入一个插件后,在linux编译时莫名其妙报错:Error: The package "esbuild-linux-64" could not be found, and is needed by esbuild.
If you are installing esbuild with npm, make sure that you don't specify the "--no-optional" flag. The "optionalDependencies" package.json feature is used by esbuild to install the correct binary executable for your current platform.
按照道理说jenkins工作区域的node_modules早就有了,怎么突然没这个依赖了呢? 直接删除工作区域代码,重新npm i 跑一遍解决了
4. 该项目开发的多页面是给安卓app用的,用的lzyzsd/JsBridge。旧版app使用registerHandler提供native调用js的能力,在新版app失效,这个库issue里面也提到了
直接将js方法挂到window下面,native去调用
// 该方法给安卓调用,安卓返回是否开启消息提醒
window.getPunchInReminderStatus = (res) => {
systemRemindOpen = res === '1'
}
5. window.onresize不触发
旧版本安卓在进入页面或者失去焦点的时候会触发window.onresize,当时使用它时为了控制fixed元素不被键盘顶起来。 在新版安卓中,键盘并没有将底部fixed元素顶起来,且失去焦点的时候window.onresize不触发了,用不上它了
你可能感兴趣的:(vite + vue3 多页面实战优化续集:eslint+lint-staged+husky+stylelint)
《昼颜》里的日本女人:相遇要万种风情,分手要残忍绝情
迷影咖啡
作者:迷之菌子神奇菇迷影咖啡:一本正经做烘焙,胡说八道聊电影漫天萤火虫消散之时良宵就将过去,人们也说含苞待放的花蕾总会开了又谢,因紧紧相拥而面红耳赤的躯体,便是我们经历过这热爱的证明。夫妻关系介绍《昼颜》是2014年电视剧《昼颜:工作日下午三点的恋人们》的续集,故事发在电视剧情节结束的三年后,讲述了已经恢复独身的纱和偶然与曾经的出轨对象北野重逢后再次陷入感情漩涡的故事。《昼颜》制作灵感源自利佳子在
android 自定义曲线图,Android自定义View——贝赛尔曲线
weixin_39767513
android 自定义曲线图
个人博客:haichenyi.com。感谢关注本文针对有一定自定义View的童鞋,最好对贝赛尔曲线有辣么一丢丢了解,不了解也没关系。花5分钟看一下GcsSloop的安卓自定义View进阶-Path之贝塞尔曲线。本文的最终效果图:最终效果图.gif思路首先他是一个只有上半部分的正弦形状的水波纹,很规则。其次,他这个正弦图左右在移动。然后,就是它这个自定义View,上下也在移动,是慢慢增加的最后,优化
所有的突然想起,都是一直放在心里
清浅白芷
一天,看到朋友圈发了一张木林的图片,熟悉而又陌生,心里怔住了一下,突然想起他以及往事。想起那年我们在旅途认识,而后又因旅途分开的故事。点点滴滴,在脑海里盘旋,在回忆里辗转。还记得相遇的那天,因为他的幽默风趣,把全场疲惫不堪的人逗笑了,他笑起来的样子不是很好看,但感觉很舒服。后来我们通过在网上联系,加深了对彼此的了解,便互生情愫,然后恋爱。只是后来,经过一年多的相处,我们就分开了。虽然时间很短,但仿
你有想删除的人生吗?(2022-10-10)
燕归来2021
中午遛弯清茶发信息给我:有本书不用看了,建议看作者的另一本。然后聊起她推给我的日剧《人生删除事务所》,我只看了一集,名字觉得很有意思,就问清茶有没有想删除的人生,她回:没有,这么平淡的日子。我:我也没有,这么精彩的人生,哈哈。虽是玩笑说,却也不完全瞎说。闺蜜性情平和佛性,我苦苦挣扎修行半靠子,她生来就有。由人生就聊到最近我追的李子勋,李老师的观点:心理学讲人性多讲道德少,讲究有效性非真实性,很多观
keras.optimizers优化器中文文档
地上悬河
python 开发语言 后端
优化器optimizers优化器是编译Keras模型必要的两个参数之一model=Sequential()model.add(Dense(64,init='uniform',input_dim=10))model.add(Activation('tanh'))model.add(Activation('softmax'))sgd=SGD(lr=0.01,decay=1e-6,momentum=0.
chrome扩展,“manifest_version“: 3, chrome 扩展图标点击事件
徐同保
chrome 前端
在Chrome扩展中,从ManifestV3开始,后台脚本(backgroundscripts)被服务工作线程(serviceworkers)所取代。这改变了扩展图标点击事件(通常称为浏览器操作或者页面操作)的处理方式。在ManifestV3中,您需要使用chrome.action.onClicked监听器来处理扩展图标的点击事件。下面是一个如何设置扩展图标点击事件处理器的示例:在manifest
npm 搭建 Vite 项目
渺小的虫子
viter 前端 javascript 开发语言
兼容性注意Vite需要Node.js版本>=12.0.0。1、使用npm安装Viter$npminitvite@latest使用npm初始化项目#npm6.xnpminitvite@latestmy-vue-app--templatevue#npm7+,需要额外的双横线:npminitvite@latestmy-vue-app----templatevue2、配置路由:npminstallvue-
中原焦点团队38期王芳芳坚持分享第236天,20230630总约练134次,来访113次,咨8次,观察员13次
芳芳王
学习焦点的初心是想拯救孩子,孩子由于沉迷游戏,成绩下滑,在学习的过程中发现是自己的教育方式出了状况。经过半年的学习,一些焦点的基本技巧,如接纳、欣赏、倾听、同理心、尊重等都有了一定的了解。但在实际应用时仍然存在很多问题,感觉自己仍然没有放下对孩子成绩的期望,仍然把握不住对孩子管理的度。我该如何去陪伴好孩子?多用心去听课,并加强反思,多约练。去思考如何让自己快乐起来?
虚拟 DOM 的优缺点有哪些
咕噜签名分发
前端 javascript 开发语言
虚拟DOM(VirtualDOM)技术作为现代前端开发中的重要组成部分,已经成为了众多流行前端框架的核心特性。它的引入为前端开发带来了诸多优势,同时也需要我们认真思考其潜在的考量。下面简单的介绍一下虚拟DOM技术的优势与缺点,深入探讨其在实际应用中的影响。提升性能虚拟DOM的最大优势之一是提升页面性能。通过比较前后两次虚拟DOM树的差异,最小化实际DOM操作,从而减少页面重渲染时的性能消耗。这种优
#D174-读书会作业-《财务自由之路》3
白洲笔记
最近沉迷于写作营,一直就没时间去弄读书会的作业,书的第二遍也就看了个开头,趁着日更的时间,赶紧把作业做了,这次是15到21课。【1.印象最深刻的部分】(本周所读内容中印象最深刻的部分)*活在未来,最正确的方法是什么?用正确的方法做正确的事情,判断什么是正确的?逻辑。学会思考。"作对事情"永远比“把事情作对“重要的多。”长远思考,耐心验证,小心总结提炼“证明自己正确并不是学习的任务和目标,时刻成长,
关于举办第十五届蓝桥杯全国软件和信息技术专业人才大赛项目实战赛的通知
QSNKJJSW
蓝桥杯 职场和发展 青少年编程 无人机 机器人 科技 人工智能
各高等院校及相关单位:为贯彻落实《中国教育现代化2035》和《国务院关于印发新时期促进集成电路产业和软件产业高质量发展若干政策的通知》有关精神,为我国制造强国和网络强国战略提供人才支持,提高学生自主创新意识和工程实践能力,工业和信息化部人才交流中心决定举办第十五届蓝桥杯全国软件和信息技术专业人才大赛——项目实战赛。大赛连续四年入围中国高等教育学会“全国普通高校大学生竞赛排行榜”竞赛项目榜单。现将项
3、JavaWeb-Ajax/Axios-前端工程化-Element
所谓远行Misnearch
# JavaWeb 前端 ajax elementui java 前端框架
P34Ajax介绍Ajax:AsynchroousJavaScriptAndXML,异步的JS和XMLJS网页动作,XML一种标记语言,存储数据,作用:数据交换:通过Ajax给服务器发送请求,并获取服务器响应的数据异步交互:在不重新加载整个页面的情况下,与服务器交换数据并实现更新部分网页的技术,例如:搜索联想、用户名是否可用的校验等等。同步与异步:同步:服务器在处理中客户端要处于等待状态,输入域名
认识一个金苹果(一)
紫藤11
群里来了一个有趣的人,很喜欢她的有才和有趣,就是嘴碎点,很好奇,她是男生?还是女生?是90后?还是80后,太多疑问,但我又不想问她,只在群里跟她斗嘴,享受这个过程。跟她斗嘴的过程,跟我跟我儿子一样,总是抬杠,但又喜欢。不管她是男生还是女生,她的文采真是很好,看她的文章,直接有读下去的欲望,有想看续集的想法,她很努力向上,也很有荣誉感,但又不想让别人看穿,总是一个吊儿郎当的样子。明明跟同桌,那么友爱
乐乐成长日记——体力
士心禾斗
下午一点乐乐醒了,我和他姥爷推着他去游泳馆游泳。乐乐哭了一路,他想抱抱。看过人家小朋友躺在车里都不哭闹的,我就硬心不理。到了游泳馆,抱着他,他就不哭了。等待阿姨们放水的时候馆里比较吵,他没有睡意。他游泳有的很开心,不停地仰泳倒泳,特别喜欢在水里突然蹬下腿激起浪花,完全不像有些小朋友进水后不动的样子。引导员提醒说,游了十几分钟了,该休息了,可是我看着乐乐游得这么开心,想让他多游会儿。引导员看我的意思
倒贴服传奇在什么平台下载 2024最火的倒贴服传奇平台排行榜
诸葛村夫一游戏频道
2024游戏盒子网站排行榜大全随着数位科技的发展,2024年手游市场持续火爆,各种新开手游持续涌现。本文为广大手游爱好者带来巅峰推荐,总结五个最具实力的手游新服发布网站,为您提供最全面的游戏资讯以及专业的游戏攻略。▶2024最火的倒贴服传奇平台排行榜TOP1:游戏豹官网特点:内部特权游戏类型:多类型推荐日活跃人数:15万网址链接:www.ystt88.cn游戏介绍:游戏豹官网以快速获取新开手游的特
flutter boost 如何从native跳转到flutter页面
Icarus_
flutter flutter
FlutterBoost是一个Flutter插件,它可以帮助开发者在原生应用和Flutter应用之间无缝跳转。以下是一些基本步骤,展示了如何使用FlutterBoost从原生(Native)页面跳转到Flutter页面。1.配置FlutterBoost在你的Flutter项目中集成FlutterBoost插件。这通常涉及到修改`pubspec.yaml`文件来添加依赖项,并根据FlutterBoo
掌握Flutter底部导航栏:畅游导航之旅
繁依Fanyi
xml json sql flutter 开发语言 前端 git
1.引言在移动应用开发中,底部导航栏是一种常见且非常实用的用户界面元素。它提供了快速导航至不同功能模块或页面的便捷方式,使用户可以轻松访问应用程序的各个部分。在Flutter中,底部导航栏也是一项强大的功能,开发者可以利用Flutter框架提供的丰富组件和灵活性,轻松实现各种样式和交互效果的底部导航栏。本文将深入探讨Flutter中底部导航栏的实现方法,从基础的结构搭建到高级功能的应用,带领读者逐
追逐梦想
悦读山人
你要想飞翔,不必成为鸟,但一定要行动。只要你坚信自己所信奉的,自己都不知道自己会做到怎样的极致。当生活中,遇到这样的坚持,会被谓之为“犟”、“固执”、“顽固”,而当我们看到这样的坚持最终也会散发不一样的光辉时,心里就有别样的感动。看《血战钢锯岭》,被道斯和多萝西的理解和坚持所感动。戴斯蒙德·道斯拒绝携带武器上战场,从他发誓不摸枪那刻起,就真的不摸枪了,哪怕入伍、上战场。他是为救人而去,而非为杀人而
十分钟自由写作
知意zy
主题:我缺乏的东西自从加入2022年弘丹写作学院,感觉每天的生活都忙碌了起来,我要上班,要学习。所以我每天都必须拼尽全力向前奔跑,才追得上小伙伴们的脚步。在写作学院,我学会了反省自己的不足,我的想法多,缺乏的东西也太多。比如:写作的文笔,写作逻辑,底层自信心……看到社群里那么多优秀的小伙伴,我感觉自己越来越自卑,我这么一个平庸的人,会完成今年的写作目标吗?我开始不停怀疑自己是否能坚持下去。而弘丹老
风险管理和采购管理核心考点梳理
WorkLee
PMP PMP 风险管理 采购管理
个人总结,仅供参考,欢迎加好友一起讨论PMP-风险管理和采购管理核心考点梳理风险管理风险是一个中性词,包括机会和威胁。风险管理的子过程非常多,但是相对来说子过程之间的逻辑非常清晰,整个风险管理的过程都是在维护一个非常重要的工件-风险登记册。风险管理是项目管理全生命周期都要开展的。1)规划风险管理风险管理计划包含哪些内容?解析:风险管理计划是描述如何安排与实施风险管理活动。(风险管理计划中无风险)包
多币种预算
朱先生_hfm
phpstorm
对于开启全球业务的公司来说,公司可能是全资子公司,控股公司,以及驻外办,预算涉及的数据,可以以本位币进行填报,也可以以中间币种,或者以报告币种进行,或者使用多种币种,例如,销售使用美元、日元、英镑,费用使用港币,这就要求预算系统需要提供一个外币折算,记录汇率的功能,使得用户可以在录入数据时候使用不同的币种,之后根据汇率,把不同币种折算成系统固定的币种
边缘计算网关在机械制造企业的应用效果和价值-天拓四方
北京天拓四方科技股份有限公司
边缘计算 其他 物联网
随着智能制造行业的飞速发展,数据量的激增和实时性要求的提高,传统的数据处理方式已经难以满足生产需求。而边缘计算网关的出现,为智能制造行业带来了革命性的变化。下面,我们将通过一个具体案例展示边缘计算网关在智能制造行业的应用效果和价值。一、案例背景某大型机械制造企业,拥有多条生产线,涉及众多设备和传感器。在生产过程中,企业需要实时监控设备的运行状态,收集生产数据,以便进行生产优化和决策支持。然而,传统
项目管理工具最佳实践
水岩
各个公司的最佳实践去哪儿jira自定义使用1.jira编号对应git分支命名,后台增加监控程序,新增一个分支,自动解析分支中的jira编号,自动落地到数据库,完成映射2.各个发布系统间信息同步,消息中心(IC)+数据中心(DC),广播消息加一站式查询,持续集成,推进代码检查质量,分钟级反馈质量检查反思:1.项目管好:针对一线研发人员,简单易用,而不是满足管理层的“统计度量”(...)简化分类字段,
VUE 页面禁止缩放(华为平板浏览器可能失效)
唐屁屁儿
JS vue webview javascript
h5页面移动端禁止缩放、web页面禁止浏览器缩放移动端优先,可禁止用户缩放和双击放大;在App.vue中的script内的方法里加入以下代码:window.onload=function(){document.addEventListener('touchstart',function(event){if(event.touches.length>1){event.preventDefault()
Apache Kafka的伸缩性探究:实现高性能、弹性扩展的关键
i289292951
kafka kafka
引言ApacheKafka作为当今最流行的消息中间件之一,以其强大的伸缩性著称。在大数据处理、流处理和实时数据集成等领域,Kafka的伸缩性为其在面临急剧增长的数据流量和多样化业务需求时提供了无与伦比的扩展能力。本文将深入探讨Kafka如何通过其独特的架构设计实现高水平的伸缩性,以及在实际部署中如何优化和利用这一特性。一、Kafka伸缩性的核心设计分区(Partitioning)与水平扩展Kafk
k8s入门到实战(十)—— CronJob详细介绍及使用示例
一弓虽
k8s学习 kubernetes 容器 云原生
CronJob什么是CronJob在k8s中,CronJob是一种用于定期执行任务的资源对象。它基于Cron表达式,允许您在指定的时间间隔内自动运行容器化的任务。CronJob可以定义以下属性:schedule:指定任务执行的时间表,使用标准的Cron表达式语法。例如,“0****”表示每小时执行一次任务。jobTemplate:定义要执行的任务的模板,通常是一个Pod模板。这个模板包含了任务所需
Java中HashMap底层数据结构及主要参数?
山间漫步人生路
java 数据结构 开发语言
在Java中,HashMap的底层数据结构主要基于数组和链表,同时在Java8及以后的版本中,当链表长度超过一定阈值时,链表会转换为红黑树来优化性能。这种结构结合了数组和链表的优点,既提供了快速的随机访问,又允许动态地扩展存储桶的大小。HashMap的主要参数包括:初始容量(InitialCapacity):这是HashMap在创建时设定的桶数组的大小。默认值为16。这个值可以根据预计存储的键值对
工资高压力大工资低休息多你怎么选择
绿蘋果
人总是面临很多选择,不久前自己刚刚放弃一份薪水还不错的工作,为了能多点时间陪陪孩子,也适当的让自己放松放松,运气好,离职后赶上疫情,对于没有人依赖的我,瞬间压力好大,本来是准备休息陪陪孩子出去走走的,这门还没出呢,就不能出门了。我承认自己有些心慌了,需要赶紧找工作了,在家休息一个月不到,我又开始赶急赶忙的找工作,一年已经过半,开始找只能网上投投简历,一直也没回复,后边终于收到面试电话了,对于来之不
Vue 常见面试题(一)
安生生申
面试题 vue.js 前端 javascript
目录1、Vue的最大的优势是什么?(必会)2、Vue和jQuery两者之间的区别是什么?(必会)3、MVVM和MVC区别是什么?哪些场景适合?(必会)1、基本定义2、使用场景3、两者之间的区别4、Vue数据双向绑定的原理是什么?(必会)5、Object.defineProperty和Proxy的区别(必会)6、Vue生命周期总共分为几个阶段?(必会)7、第一次加载页面会触发哪几个钩子函数?(必会)
Webpack构建优化——区分环境
oWSQo
为什么需要区分环境在开发网页的时候,一般都会有多套运行环境,例如:在开发过程中方便开发调试的环境。发布到线上给用户使用的运行环境。这两套不同的环境虽然都是由同一套源代码编译而来,但是代码内容却不一样,差异包括:线上代码被特殊压缩过。开发用的代码包含一些用于提示开发者的提示日志,这些日志普通用户不可能去看它。开发用的代码所连接的后端数据接口地址也可能和线上环境不同,因为要避免开发过程中造成对线上数据
多线程编程之join()方法
周凡杨
java JOIN 多线程 编程 线程
现实生活中,有些工作是需要团队中成员依次完成的,这就涉及到了一个顺序问题。现在有T1、T2、T3三个工人,如何保证T2在T1执行完后执行,T3在T2执行完后执行?问题分析:首先问题中有三个实体,T1、T2、T3, 因为是多线程编程,所以都要设计成线程类。关键是怎么保证线程能依次执行完呢?
Java实现过程如下:
public class T1 implements Runnabl
java中switch的使用
bingyingao
java enum break continue
java中的switch仅支持case条件仅支持int、enum两种类型。
用enum的时候,不能直接写下列形式。
switch (timeType) {
case ProdtransTimeTypeEnum.DAILY:
break;
default:
br
hive having count 不能去重
daizj
hive 去重 having count 计数
hive在使用having count()是,不支持去重计数
hive (default)> select imei from t_test_phonenum where ds=20150701 group by imei having count(distinct phone_num)>1 limit 10;
FAILED: SemanticExcep
WebSphere对JSP的缓存
周凡杨
WAS JSP 缓存
对于线网上的工程,更新JSP到WebSphere后,有时会出现修改的jsp没有起作用,特别是改变了某jsp的样式后,在页面中没看到效果,这主要就是由于websphere中缓存的缘故,这就要清除WebSphere中jsp缓存。要清除WebSphere中JSP的缓存,就要找到WAS安装后的根目录。
现服务
设计模式总结
朱辉辉33
java 设计模式
1.工厂模式
1.1 工厂方法模式 (由一个工厂类管理构造方法)
1.1.1普通工厂模式(一个工厂类中只有一个方法)
1.1.2多工厂模式(一个工厂类中有多个方法)
1.1.3静态工厂模式(将工厂类中的方法变成静态方法)
&n
实例:供应商管理报表需求调研报告
老A不折腾
finereport 报表系统 报表软件 信息化选型
引言
随着企业集团的生产规模扩张,为支撑全球供应链管理,对于供应商的管理和采购过程的监控已经不局限于简单的交付以及价格的管理,目前采购及供应商管理各个环节的操作分别在不同的系统下进行,而各个数据源都独立存在,无法提供统一的数据支持;因此,为了实现对于数据分析以提供采购决策,建立报表体系成为必须。 业务目标
1、通过报表为采购决策提供数据分析与支撑
2、对供应商进行综合评估以及管理,合理管理和
mysql
林鹤霄
转载源:http://blog.sina.com.cn/s/blog_4f925fc30100rx5l.html
mysql -uroot -p
ERROR 1045 (28000): Access denied for user 'root'@'localhost' (using password: YES)
[root@centos var]# service mysql
Linux下多线程堆栈查看工具(pstree、ps、pstack)
aigo
linux
原文:http://blog.csdn.net/yfkiss/article/details/6729364
1. pstree
pstree以树结构显示进程$ pstree -p work | grep adsshd(22669)---bash(22670)---ad_preprocess(4551)-+-{ad_preprocess}(4552) &n
html input与textarea 值改变事件
alxw4616
JavaScript
// 文本输入框(input) 文本域(textarea)值改变事件
// onpropertychange(IE) oninput(w3c)
$('input,textarea').on('propertychange input', function(event) {
console.log($(this).val())
});
String类的基本用法
百合不是茶
String
字符串的用法;
// 根据字节数组创建字符串
byte[] by = { 'a', 'b', 'c', 'd' };
String newByteString = new String(by);
1,length() 获取字符串的长度
&nbs
JDK1.5 Semaphore实例
bijian1013
java thread java多线程 Semaphore
Semaphore类
一个计数信号量。从概念上讲,信号量维护了一个许可集合。如有必要,在许可可用前会阻塞每一个 acquire(),然后再获取该许可。每个 release() 添加一个许可,从而可能释放一个正在阻塞的获取者。但是,不使用实际的许可对象,Semaphore 只对可用许可的号码进行计数,并采取相应的行动。
S
使用GZip来压缩传输量
bijian1013
java GZip
启动GZip压缩要用到一个开源的Filter:PJL Compressing Filter。这个Filter自1.5.0开始该工程开始构建于JDK5.0,因此在JDK1.4环境下只能使用1.4.6。
PJL Compressi
【Java范型三】Java范型详解之范型类型通配符
bit1129
java
定义如下一个简单的范型类,
package com.tom.lang.generics;
public class Generics<T> {
private T value;
public Generics(T value) {
this.value = value;
}
}
【Hadoop十二】HDFS常用命令
bit1129
hadoop
1. 修改日志文件查看器
hdfs oev -i edits_0000000000000000081-0000000000000000089 -o edits.xml
cat edits.xml
修改日志文件转储为xml格式的edits.xml文件,其中每条RECORD就是一个操作事务日志
2. fsimage查看HDFS中的块信息等
&nb
怎样区别nginx中rewrite时break和last
ronin47
在使用nginx配置rewrite中经常会遇到有的地方用last并不能工作,换成break就可以,其中的原理是对于根目录的理解有所区别,按我的测试结果大致是这样的。
location /
{
proxy_pass http://test;
java-21.中兴面试题 输入两个整数 n 和 m ,从数列 1 , 2 , 3.......n 中随意取几个数 , 使其和等于 m
bylijinnan
java
import java.util.ArrayList;
import java.util.List;
import java.util.Stack;
public class CombinationToSum {
/*
第21 题
2010 年中兴面试题
编程求解:
输入两个整数 n 和 m ,从数列 1 , 2 , 3.......n 中随意取几个数 ,
使其和等
eclipse svn 帐号密码修改问题
开窍的石头
eclipse SVN svn帐号密码修改
问题描述:
Eclipse的SVN插件Subclipse做得很好,在svn操作方面提供了很强大丰富的功能。但到目前为止,该插件对svn用户的概念极为淡薄,不但不能方便地切换用户,而且一旦用户的帐号、密码保存之后,就无法再变更了。
解决思路:
删除subclipse记录的帐号、密码信息,重新输入
[电子商务]传统商务活动与互联网的结合
comsci
电子商务
某一个传统名牌产品,过去销售的地点就在某些特定的地区和阶层,现在进入互联网之后,用户的数量群突然扩大了无数倍,但是,这种产品潜在的劣势也被放大了无数倍,这种销售利润与经营风险同步放大的效应,在最近几年将会频繁出现。。。。
如何避免销售量和利润率增加的
java 解析 properties-使用 Properties-可以指定配置文件路径
cuityang
java properties
#mq
xdr.mq.url=tcp://192.168.100.15:61618;
import java.io.IOException;
import java.util.Properties;
public class Test {
String conf = "log4j.properties";
private static final
Java核心问题集锦
darrenzhu
java 基础 核心 难点
注意,这里的参考文章基本来自Effective Java和jdk源码
1)ConcurrentModificationException
当你用for each遍历一个list时,如果你在循环主体代码中修改list中的元素,将会得到这个Exception,解决的办法是:
1)用listIterator, 它支持在遍历的过程中修改元素,
2)不用listIterator, new一个
1分钟学会Markdown语法
dcj3sjt126com
markdown
markdown 简明语法 基本符号
*,-,+ 3个符号效果都一样,这3个符号被称为 Markdown符号
空白行表示另起一个段落
`是表示inline代码,tab是用来标记 代码段,分别对应html的code,pre标签
换行
单一段落( <p>) 用一个空白行
连续两个空格 会变成一个 <br>
连续3个符号,然后是空行
Gson使用二(GsonBuilder)
eksliang
json gson GsonBuilder
转载请出自出处:http://eksliang.iteye.com/blog/2175473 一.概述
GsonBuilder用来定制java跟json之间的转换格式
二.基本使用
实体测试类:
温馨提示:默认情况下@Expose注解是不起作用的,除非你用GsonBuilder创建Gson的时候调用了GsonBuilder.excludeField
报ClassNotFoundException: Didn't find class "...Activity" on path: DexPathList
gundumw100
android
有一个工程,本来运行是正常的,我想把它移植到另一台PC上,结果报:
java.lang.RuntimeException: Unable to instantiate activity ComponentInfo{com.mobovip.bgr/com.mobovip.bgr.MainActivity}: java.lang.ClassNotFoundException: Didn't f
JavaWeb之JSP指令
ihuning
javaweb
要点
JSP指令简介
page指令
include指令
JSP指令简介
JSP指令(directive)是为JSP引擎而设计的,它们并不直接产生任何可见输出,而只是告诉引擎如何处理JSP页面中的其余部分。
JSP指令的基本语法格式:
<%@ 指令 属性名="
mac上编译FFmpeg跑ios
啸笑天
ffmpeg
1、下载文件:https://github.com/libav/gas-preprocessor, 复制gas-preprocessor.pl到/usr/local/bin/下, 修改文件权限:chmod 777 /usr/local/bin/gas-preprocessor.pl
2、安装yasm-1.2.0
curl http://www.tortall.net/projects/yasm
sql mysql oracle中字符串连接
macroli
oracle sql mysql SQL Server
有的时候,我们有需要将由不同栏位获得的资料串连在一起。每一种资料库都有提供方法来达到这个目的:
MySQL: CONCAT()
Oracle: CONCAT(), ||
SQL Server: +
CONCAT() 的语法如下:
Mysql 中 CONCAT(字串1, 字串2, 字串3, ...): 将字串1、字串2、字串3,等字串连在一起。
请注意,Oracle的CON
Git fatal: unab SSL certificate problem: unable to get local issuer ce rtificate
qiaolevip
学习永无止境 每天进步一点点 git 纵观千象
// 报错如下:
$ git pull origin master
fatal: unable to access 'https://git.xxx.com/': SSL certificate problem: unable to get local issuer ce
rtificate
// 原因:
由于git最新版默认使用ssl安全验证,但是我们是使用的git未设
windows命令行设置wifi
surfingll
windows wifi 笔记本wifi
还没有讨厌无线wifi的无尽广告么,还在耐心等待它慢慢启动么
教你命令行设置 笔记本电脑wifi:
1、开启wifi命令
netsh wlan set hostednetwork mode=allow ssid=surf8 key=bb123456
netsh wlan start hostednetwork
pause
其中pause是等待输入,可以去掉
2、
Linux(Ubuntu)下安装sysv-rc-conf
wmlJava
linux ubuntu sysv-rc-conf
安装:sudo apt-get install sysv-rc-conf 使用:sudo sysv-rc-conf
操作界面十分简洁,你可以用鼠标点击,也可以用键盘方向键定位,用空格键选择,用Ctrl+N翻下一页,用Ctrl+P翻上一页,用Q退出。
背景知识
sysv-rc-conf是一个强大的服务管理程序,群众的意见是sysv-rc-conf比chkconf
svn切换环境,重发布应用多了javaee标签前缀
zengshaotao
javaee
更换了开发环境,从杭州,改变到了上海。svn的地址肯定要切换的,切换之前需要将原svn自带的.svn文件信息删除,可手动删除,也可通过废弃原来的svn位置提示删除.svn时删除。
然后就是按照最新的svn地址和规范建立相关的目录信息,再将原来的纯代码信息上传到新的环境。然后再重新检出,这样每次修改后就可以看到哪些文件被修改过,这对于增量发布的规范特别有用。
检出