vue项目优化
cross-env 包环境静态文件分离require 是置顶的双斜杠 //baidu.com可以是http也可以是httpsrequire.ensure打包到不同的文件中项目文件路径规范静态文件（不需要打包的文件）放在static路径下，同时静态文件使用es5语法，css原生语法...
2024-01-10
vue项目总结
如果port被占用，修改浏览器的port，那么进入config的index.js的port修改串口号即可。vue项目main.js文件下import router from \'./router\'默认导入router文件夹下index.js的原因https://www.cnblogs.com/beyrl-blog/p/8629178.htmlindex.js的module.exports包含dev和build两个部分。https://www.jianshu.com/p/8ab4fb18b6b9https:...
2024-01-10
vue项目的配置
1、第一首先我们先安装：visual studio code开发环境，可以换成中文版的。2、安装note.js 下载链接：https://nodejs.org/en/3、安装npm使用淘宝镜像https://npm.taobao.org/ 也可以打开cmd键入：npm install -g cnpm --registry=https://registry.npm.taobao.org4、打开cmd键入：cnpm install -g @vue/cli5、安装完毕使用在cmd 键入：vue ui ...
2024-01-10
vue项目基本流程
一、做项目基本流程： 1、规划组件结构 Nav.vue Header.vue Home.vue..... 2、编写对应路由 vue-router 3、具体些每个组件功能 一些公共的文件jquery,jquery插件,一般在index.html文件里面引用 分析项目需...
2024-01-10
vue项目打包报错
vue项目打包报错老项目拉下来后改了些样式，再次打包他会报错npm ERR! missing script: build npm ERR! A complete log of this run can be found in: npm ERR! C:\Users\Administrator\AppData\Roaming\npm-cache_logs\2020-05-12T06_25_52_458Z-debug.log解决办法：找到package.json的，看有没有安装optimize-css-asset...
2024-01-10
vue项目打包问题
vuecli4项目。 "scripts": { "serve": "vue-cli-service serve && webpack-dev-server --open", "test": "vue-cli-service build --mode testServer", "build": "vue-cli-service build", "webpack": ...
2024-02-16
初始化前端vue项目
一、用webstorm或者vs（其他工具都可）打开项目>文件>打开二、可以现在控制台中输入 npm run serve 先运行项目，出现的local地址复制，打开浏览器输入就可以看到项目三、进入App.vue文件，删除多余的部份四、先清空路由文件中index.js的引入组件，再删除三个多余的组件结果如下图：五、再company中新建一...
2024-01-10
nuxt重构vue项目
背景：公司要求用nuxt重构vue项目，目的是为了服务端渲染ssr，提高加载速度，nuxt还可以实现seo优化，但是由于是后台管理项目，所以没用到这个功能。改造的时候确实遇到很多坑，想过不用这个框架，自己配置ssr，由于自己配置ssr更复杂，所以硬着头皮改完了，现在总结一下遇到的问题，一来做完...
2024-01-10
vue项目前端埋点的实现
埋点方案的确定。业界的埋点方案主要分为以下三类：代码埋点：在需要埋点的节点调用接口，携带数据上传。如百度统计等；可视化埋点：使用可视化工具进行配置化的埋点，即所谓的「无痕埋点」，前端在页面加载时，可以读取配置数据，自动调用接口进行埋点。如开源的Mixpanel;无埋点：前端...
2024-01-10
Vue商城项目04
绘制 商品列表 页面基本结构并美化<template> <div class="goods-list"> <div class="goods-item"> <img src="https://img14.360buyimg.com/n0/jfs/t1/68656/34/7819/87669/5d5e0becE1808db2a/4f29ef986f103e36.jpg" alt=""> <h1 class="title">小米（Mi）小米Note 16G双网通版</h1> ...
2024-01-10
如何优化vue的项目体积?
最近比较空闲 相对当前的两个前端项目进行优化,本地打包感觉有点慢,看了一下项目里面引了很多依赖,很多是不必要的:package.json文件如下:{ "name": "amconsole", "version": "1.0.0", "description": "A Vue.js project", "author": "", "private": true, "scrip...
2024-02-11
Vue的项目文件介绍
一、初始化一个项目使用npm init -y来初始化一个项目。然后使用npm install --save-dev ...来安装需要的软件包，这样在package.json文件中就会自动添加相应的依赖。二、package.json和package-lock.json的区别package-lock就是锁定安装时的包版本号，需要上传到git上，以保证其他人在install时候，大家的依赖版本相同...
2024-01-10
vue项目钩子hook问题？
在一个vue项目中，当前我有两个hook：useTable和useFrom并且有两个请求 requestA和requestB，useTable中需要请求requestA并获取到其返回的数据。hooksB中需要请求requestA和requestB，并且useForm中要求要请求完requestA才能请求requestB，因为在requestB中需要用到requestA返回的数据。我如何才能不让re...
2024-02-22
NUXT vue项目打包发布
nuxt是Vue项目服务器端渲染的通用型框架，主要作用是SEO优化；具体的搭建项目我这里就不做说明了，大家阔以参考https://zh.nuxtjs.org/guide/installation官方文档说明。接下来我为大家介绍一下打包发布到服务器的问题：1、首先执行npm run build；2、将打包好的.nuxtstaticnuxt.config.jspackage.json 这四个文件丢...
2024-01-10如何为vue的项目添加单元测试
动机单元测试能避免出现一些代码运行结果与预期不符的错误，通常是一些比较低级但又难以发现的问题。粗心且懒，在每次调整之后，需要不断地检查代码，反复去走流程。担心由于自己的改动而导致了逻辑上的错误。而这里面的一大部分工作其实可以让单元测试来完成。有了单元测试之后，可...
2024-01-10
IDEA引入vue项目启动配置
第一步：：默认配置第二步：来到你vue项目的目录看到(src同级)shift+右键打开cmd窗口 输入npm install之后项目就会多出一个node_modules的文件夹 下载成功第三步：下载成功后 在输入npm run dev 之后 项目就会自动运行了 这个就表示自动运行了 谢谢！！！...
2024-01-10
Vue_打包并发布项目
一、 打包vue项目步骤：1、对当前vue项目进行打包的命令如下：npm run build 2、打包完成，会输出Build complete并且在vue项目中会生成一个名字为dist的打包文件。如下图：二、 使用静态服务器工具包发布打包的vue项目1、首先安装全局的serve，如下图： 命令如下：serve + 打包文件名serve dist 效果图如...
2024-01-10
Vue项目开发目录结构
最近做一些CI+Vue开发的简单项目，由于刚开始一直从事后端，对Vue了解不是很多，fork了团队的项目代码发现项目的文件夹很多，一时间有些懵，上网上参考了部分资料，博客园中的放晴的天空与狮子爱吃草两位的博客提供了很大的帮助，现将该部分知识做以下总结。下图为Vue项目文件夹：以下就项目...
2024-01-10
vue项目打包发布，跨域问题求助
vue开发了以一个小插件，中间调用了一个第三方接口，在本地开发环境中，配置了proxy，解决了跨域问题，但是打包之后，发布npm包后，失效了这里该怎么解决呢，或者有什么思路呢，各位大佬们这里是发布npm包（中间调用了一个第三方接口），解决跨域，配置nginx肯定不合适在这种情形试了网上的方案，jsonp跨域，但是这个第三方接口做了限制（crob)，jsonp跨域不成功回答：可以尝试让后端出个代理...
2024-02-22
vue项目打包以及优化的实现步骤
目录vue项目的打包上线及优化vue项目的打包项目托管项目的常见优化vue项目的打包上线及优化项目完成，我们会将项目进行上线，为了提升性能，我们往往会进行一些优化处理vue项目的打包脚手架项目中有一个默认的打包命令,我们可以输入npm run bulid来对项目进行打包打开终端，切换到项目根目...
2024-01-10详解vue移动端项目代码拆分记录
撸一套vue多端共用，非常适合需要快速且全面上线的项目。但是多端共用一套vue代码，由于平台间的互相限制，每端在某些业务例如支付分享等是完全独立的代码，每个平台的支付方式也会有所差异，造成在这些业务的实现过程中会有太冗余的“if else”判断。所以为了提高代码的复用性、扩展性，可...
2024-01-10vue项目跳转至外部链接并传参？
跳转前页面路径：比如： http://localhost:8005/main/想要跳转到页面：https://a/b/aa = 12 & bb = 33& cc = 44用router.push会连源地址一起跳转：localhost:8005/main/https://a/b/aa = 12 & bb = 33& cc = 44；目前采用方法：const url = 'aa = 12 & bb ...
2024-02-25
项目vue2.0仿外卖APP（一）
http://www.cnblogs.com/Chen-XiaoJun/p/6247225.html最近在学习慕课网的课程：用vue.js做一个仿饿了么外卖APP的项目，现在也把流程啊什么的暂时先整理一下在这个博客上面。当然，这个过程会有点长，不过确实能学到很多东西。话不多说，马上开始吧。注：当我们把用vue-cli脚手架搭建成的vue项目复制到其他...
2024-01-10
vue 项目软键盘回车触发搜索事件
目的：掉起来右下角为搜索的按钮步骤：1、input的type改为search，再写keydown按下时的事件调取搜索事件的方法这样安卓手机上回车就变成了“搜索”，不过ios仍然是换行2、input 外面套form，必须要有action，action=“javascript:return true”我的项目用van：想弹出数字键盘，并监听搜索（换行），在安卓上执...
2024-01-10
