![](https://img-blog.csdnimg.cn/20201014180756927.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
vue
年少不知春衫薄
程序界-吴彦祖
展开
-
linux 安装node
centos7 64位wget https://nodejs.org/dist/v16.8.0/node-v16.8.0-linux-x64.tar.gztar xf node-v5.10.1-linux-x64.tar.gz -C /usr/local/cd /usr/local/mv node-v16.8.0-linux-x64/ nodejsln -s /usr/local/nodejs/bin/node /usr/local/binln -s /usr/local/nodejs/b.原创 2021-08-27 13:58:00 · 213 阅读 · 0 评论 -
vue前端项目优化
本次针对的是vue cli脚手架进行webpack相关的配置,包含到nginx 和dockerfile部署环境@vue/cli 4.5.13 、nginx、dockerfile、 k8sCI\CD一、包体积优化分隔js代码分隔出来的js文件名/*webpackChunkName:"register"*/ { path: '/401', component: () => import(/* webpackChunkName: "4...原创 2021-08-26 16:56:28 · 319 阅读 · 0 评论 -
npm ERR! code E403 npm发布包失败 403
npm ERR! code E403npm ERR! 403 403 Forbidden - PUT http://registry.npmjs.org/xpx-ui - Forbiddennpm ERR! 403 In most cases, you or one of your dependencies are requestingnpm ERR! 403 a package version that is forbidden by your security policy.根据网上说..原创 2021-08-26 14:21:44 · 5820 阅读 · 1 评论 -
关于webpack中babel插件的使用
1.为什么需要BABELwebpack是不能解析es6语法的,需要用到插件来转化为es5和浏览器能识别的文件2.NPM安装和配置1.cnpm i babel-corebabel-loader@7babel-plugin-transform-runtime -D这里我使用的cnpm指令安装可以更快,尽量不要npm和cnpm指令混用,因为可能是npm删掉cnpm之前安装的包,,所以要么一直用npm或者cnpm。这个包核心是babel-loader和core,第二个是插件plugin,需要辅助用...原创 2021-03-30 11:52:00 · 582 阅读 · 0 评论 -
vue项目使用GZIP(SPA应用优化)
服务器启用GZIP http { include /etc/nginx/mime.types; default_type application/octet-stream; log_format main '$remote_addr - $remote_user [$time_local] "$request" ' '$status $body_bytes_sent "$http_referer" ..原创 2021-03-29 22:21:02 · 230 阅读 · 0 评论 -
TypeError: Cannot read property ‘tapPromise‘ of undefined
// 打包压缩 config.plugin('CompressionPlugin').use( new CompressionPlugin({ filename: '[path].gz[query]', // 压缩后的文件名(保持原文件名,后缀加.gz) algorithm: 'gzip', // 使用gzip压缩 test: new RegExp('\\.(' + ['js', 'css'].join('|') + ')$'), ...原创 2021-03-29 19:21:34 · 9670 阅读 · 0 评论 -
vue全家桶接入mock express(mock升级版)
mock基础版本需要通过before实现before: require('./mock'),//引入mock/index.jsmock+express废话不多说线上代码pm i express -D npm i mockjs -Dexpress了解连接https://www.expressjs.com.cn/starter/hello-world.html新建api文件 放接口路由配置data 文件夹放json数据新建mock-serve.js 启动文件...原创 2021-03-18 18:46:22 · 232 阅读 · 0 评论 -
vue cli 接入 mock
什么是mockjs?他的使用场景是什么?当前端工程师需要独立于后端并行开发时,后端接口还没有完成,那么前端怎么获取数据?这时可以考虑前端搭建web server自己模拟假数据,mockjs用来生成随机数据,拦截 Ajax 请求。下面引用mockjs官网的图片:正文:如何改造vue-cli,将mockjs嵌入到webpack?vue项目初始化安装vue-cli脚手架工具,并初始化项目 //全局安装 vue-cli npm install vue-cli -g ...原创 2021-03-17 13:54:11 · 239 阅读 · 0 评论 -
webpack 打包实现
什么是webpack?模块打包机:它做的事情是,分析你的项目结构,找到JavaScript模块以及其它的一些浏览器不能直接运行的拓展语言(Scss,TypeScript等),并将其转换和打包为合适的格式供浏览器使用。为什么使用webpack模块化可以使复杂的程序细化成为各个小的文件 预处理器可以对Scss,less等CSS预先进行处理 前端工程化 ...... 创建项目 以下为mac命令执行 liuyuquan@liuyuquandeMacBook-Pro w...原创 2021-03-05 17:22:59 · 72 阅读 · 0 评论 -
前端自动化部署(头脑风暴)
前端自动化部署前言:楼主公司项目用的是vue技术栈,考虑以下方案1、阿里云teambitionhttps://www.teambition.com 阿里全套的开发工具2、gitlab-ci、cd 自动化部署3、项目本地直传ssh24、jenkens(docker部署或者静态文件部署)...原创 2021-01-30 18:06:18 · 238 阅读 · 0 评论 -
前端代码规范文档(Vue、es6、ts、部分js)
Vue 开发规范目录及说明规范目的 命名规范 结构化规范 注释规范 编码规范 CSS 规范规范目的为提高团队协作效率,便于后台人员添加功能及前端后期项目有何迭代,以及提高自身代码质量,让大家书写可维护的代码,而不是一次性的代码,让代码能一目了然,业务逻辑实现表达清晰命名规范普通变量命名规范命名方法 :驼峰命名法命名规范 :命名必须是跟需求的内容相关的词,比如说我想申明一个变量,用来表示我的学校,那么我们可以这样定义const mySchool = "我的..原创 2021-01-08 11:16:21 · 2120 阅读 · 1 评论 -
vue cil3 去除console
1、安装插件babel-plugin-transform-remove-consolenpm install babel-plugin-transform-remove-console --save-dev# oryarn add babel-plugin-transform-remove-console --dev 2、在【babel.config.js】配置如下if(process.env.NODE_ENV === 'production') { plugins.push(.原创 2020-06-15 13:58:34 · 148 阅读 · 0 评论 -
微信二次分享 微信浏览器打开页面时 IOS隐藏复制按钮和自定义菜单按钮时失效问题(特殊情况下)
背景vue项目-开发h5 防止个人信息隐私泄漏 要求html页面开发微信二次分享 只能发送给个人 ,隐藏所有保护类操作,自定义传播类操作, 复制链接/原网页等等 微信开发API,保护类,传播类请查看目录3 https://developers.weixin.qq.com/doc/offiaccount/OA_Web_Apps/JS-SDK.html解决...原创 2019-11-05 15:47:33 · 1360 阅读 · 0 评论 -
vue tabbar 如何利用嵌套路由 实现页面切换 以及记录高度 非history模式
项目中有时用到多个页面 记录滚动高度 让用户有更好的体验利用路由实现 嵌套路由 监听高度项目源码<template> <div id="tabs" class="tabs"> <div>{{active}}</div> <keep-alive> <...原创 2019-10-17 16:05:23 · 1375 阅读 · 0 评论