【【转】vue项目打包部署——nginx代理访问】教程文章相关的互联网学习教程文章

解决vue项目中使用/deep/报错

方法:降低sass-loader版本1.卸载当前项目中的sass-loadernpm uninstall sass-loader2.安装低版本sass-loadernpm install sass-loader@7.0.03.安装node-sassnpm install node-sass安装node-sass是因为安装低版本sass-loader需要引入node-sass依赖来支持,不然会报错 原文:https://www.cnblogs.com/xiaobaibubai/p/14776828.html

vue 项目碰到的问题

易车三期的项目,碰到的vue问题,暂时记录一下。  1、跨vue组件的方法调用  2、路由的跳转,带参数的(例如ID)跳转不到其他的页面  3、js文件的导出和引入,在一个vue文件中调用js文件的方法,此行为可以抽取公共的函数。  4、provide、inject 方法调用跨vue组件的methods中的方法  5、组件部分的引入,使用原文:https://www.cnblogs.com/smile-fanyin/p/12347998.html

vue项目中实现手势密码【代码】【图】

本来是写在一个页面中的,但后来一想创建和登录的时候都得用,干脆就写成组件吧。自知写的很差,还望各位大佬指教一二父组件中不传值的话就默认是创建手势密码(创建时密码长度不能小于4),需要输入两次,两次密码必须一致如果是登录,父组件就把密码传给子组件,子组件就会根据密码判断当前输入是否正确,具体执行时请看控制台演示:父组件未传值,此时是创建手势密码 登录时,父组件穿的值为<gestureUnlock :fatherPassword=...

react和vue项目快速搭建

react项目快速搭建  1.安装node环境:    下载地址:https://nodejs.org/zh-cn/download/  2.打开终端  3.安装yarn或者cnpm, 这里以cnpm 为例,输入命令行:    npm install cnpm -g --registry=http://registry.npm.taobao.org  4.安装create-react-app,输入命令行:    cnpm install -g create-react-app    说明:这里安装在全局中,安装一次就可以了。  5.创建react项目,输入命令行:    create...

vue项目目录介绍【代码】

尽管vue-cli已经优化了好多配置和目录机构,但是下面的介绍还是有用的。buildwebpack 配置相关configwebpack 配置相关src源码static第三方静态资源.gitkeepgit默认不提交空目录 放在空目录中,可以使git提交的时候,提交该目录。.babelrcbabel的配置,es6代码通过babel编译成es5. presets预设,表示预先要安装哪些插件; plugins,表示要安装的插件,这些插件很有可能互相依赖.editorconfig编辑器的配置相关.eslintignore忽略语法检...

Vue项目中的跨域问题(开发环境、生产环境)【代码】【图】

刚工作两个月,公司项目的代码还没接触明白,今天偶然看到了前端项目中vue.config.js对于后台接口的配置 devServer: {port: port,open: false,overlay: {warnings: false,errors: true},proxy: {[process.env.VUE_APP_BASE_API]: {target: `http://localhost:8080/ShaoxingBackend/`,changeOrigin: true,pathRewrite: {[‘^‘ + process.env.VUE_APP_BASE_API]: ‘‘}}}// after: require(‘./mock/mock-server.js‘)},proxy应该是...

使用vue-cli搭建vue项目问题解决方案【图】

工欲善其事必先利其器,安装所需环境node和npm的安装 首先需要安装node环境,直接到官网下载安装包 https://nodejs.org/zh-cn/ 安装node默认安装npm, 不需要重复安装npm。安装完成后,可以命令行工具中输入 node -v 和 npm -v,如果能显示出版本号,就说明安装成功。下载dev-tool工具 为了以后调式做准备 https://github.com/vuejs/vue-devtools#vue-devtools安装全局vue-cli脚手架 npm install -g vue-cli 出现如下问题: npm ins...

基于Idea从零搭建一个最简单的vue项目【图】

一、需要了解的基本知识node.jsNode.js是一个Javascript运行环境(runtime),发布于2009年5月,由Ryan Dahl开发,实质是对Chrome V8引擎进行了封装。Node.js对一些特殊用例进行优化,提供替代的API,使得V8在非浏览器环境下运行得更好。V8引擎执行Javascript的速度非常快,性能非常好。 Node.js是一个基于Chrome JavaScript运行时建立的平台, 用于方便地搭建响应速度快、易于扩展的网络应用。Node.js 使用事件驱动, 非阻塞I/O模型...

Vue项目中自动将px转换为rem【代码】【图】

一、配置与安装步骤: 1、在 Vue 项目的 src 文件夹下创建一个 config 文件夹: 2、在 config 文件夹中创建 rem.js: 3、将以下代码复制到 rem.js 中:(function(){function a(){var b=document.documentElement.clientWidth;b=b>750?750:b;var c=b/750*100;document.getElementsByTagName("html")[0].style.fontSize=c+"px"}a();window.onresize=a})(); 4、在 src 文件夹下的 main.js 中引入:import ‘./config/rem‘ 5、在 Vue ...

阐述vue项目中package.json与package-lock.json作用及区别【图】

我们每次新建一个项目的时候会发现在项目中会有这么俩个相似的文件,并且一个里边东西很多一个里边的东西很简洁,那么他们到底有什么区别与联系。  npm5之前的版本,是不会生成package-lock.json这个文件的。npm5版本及以后,才会生成package-lock.json文件;当使用npm安装包的时候,npm都会生成或者更新package-lock.json文件,npm5版本及以后的版本,在安装包的时候,不需要加 --save(-s) 参数,也会自动在package.json中保存...

【转】vue项目打包部署——nginx代理访问【图】

我又来了,今天部署了下vue项目,使用nginx做了代理,这样可以解决跨域的问题,这里做一个简单讲解。1.先看vue项目打包(我这里使用的是vscode开发工具)这里是我的项目结构:打包之前需要修改如下配置文件:配置文件一:build>>utils.js (修改publicPath:"../../" , 这样写是处理打包后找不到静态文件的问题)配置文件二:config>>index.js(修改assetsPublicPath:‘./‘ ,修改目的是为了解决js找不到的问题)上面两步修改完成之后就...

vue项目性能优化【代码】

Vue 代码层面的优化;webpack 配置层面的优化;基础的 Web 技术层面的优化。一、代码层面的优化1.1、v-if 和 v-show 区分使用场景v-if?是?真正?的条件渲染,因为它会确保在切换过程中条件块内的事件监听器和子组件适当地被销毁和重建;也是惰性的:如果在初始渲染时条件为假,则什么也不做——直到条件第一次变为真时,才会开始渲染条件块。 v-show?就简单得多, 不管初始条件是什么,元素总是会被渲染,并且只是简单地基于 CSS 的...

16.如何做到webpack打包vue项目后,可以修改配置文件【代码】【图】

问题描述:前端需要修改restful API的url,但是打包之后,配置文件找不到了,如果在npm run build 生成dist后,这个配置也被写死了,传到运行的前端服务器上后,假设某次,api服务器的ip修改了,改动只是更新下这个url,但是却需要会到前端源码,url后,在重新npm run build,然后再把整个dist再重新传到前端服务器,才可以。解决方法:用了generate-asset-webpack-plugin 这个插件,在webpack.prod.conf.js中去生成configServer.js...

VUE项目中使用this.$forceUpdate(),解决页面v-for中修改item属性值后视图数据不更新问题【图】

例如在修改属性值的时候 this.$set(this.curPlayList[this.curClickDevice.wndNum], ‘description‘, rsp.Message.returnMsg || ‘播放异常‘) 页面数据curPlayList并没有发生变化,最后解决方案是在后面添加this.$forceUpdate(),进行强制更新。在某些文件,没有this,那就用Vue.$forceUpdate() 原文:https://www.cnblogs.com/luoxuemei/p/13745753.html

从0开始布置vue3项目工程【代码】【图】

1:首先 查看node 版本node -v npm install stable  3:初始化 vitejs 然后就会叫你选择 语言直接选 vue-ts 然后cd 进入项目 初始化即可 npm init @vitejs/app 项目名称:vite-vue3-ts cd vite-vue3-tsnpm installnpm run dev 打开成功这个页面就说明成功了 4:打开项目 打开 vite-config.ts 文件,修改指向目录import { defineConfig } from ‘vite‘ import vue from ‘@vitejs/plugin-vue‘ import { resolve } ...