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-cli已经优化了好多配置和目录机构，但是下面的介绍还是有用的。buildwebpack 配置相关configwebpack 配置相关src源码static第三方静态资源.gitkeepgit默认不提交空目录 放在空目录中，可以使git提交的时候，提交该目录。.babelrcbabel的配置，es6代码通过babel编译成es5. presets预设，表示预先要安装哪些插件； plugins,表示要安装的插件，这些插件很有可能互相依赖.editorconfig编辑器的配置相关.eslintignore忽略语法检...
刚工作两个月，公司项目的代码还没接触明白，今天偶然看到了前端项目中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应该是...
工欲善其事必先利其器,安装所需环境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...
一、需要了解的基本知识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模型...
一、配置与安装步骤： 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 ...
我们每次新建一个项目的时候会发现在项目中会有这么俩个相似的文件，并且一个里边东西很多一个里边的东西很简洁，那么他们到底有什么区别与联系。 npm5之前的版本，是不会生成package-lock.json这个文件的。npm5版本及以后，才会生成package-lock.json文件；当使用npm安装包的时候，npm都会生成或者更新package-lock.json文件，npm5版本及以后的版本，在安装包的时候，不需要加 --save（-s） 参数，也会自动在package.json中保存...
我又来了，今天部署了下vue项目，使用nginx做了代理，这样可以解决跨域的问题，这里做一个简单讲解。1.先看vue项目打包（我这里使用的是vscode开发工具）这里是我的项目结构：打包之前需要修改如下配置文件：配置文件一：build>>utils.js (修改publicPath:"../../" , 这样写是处理打包后找不到静态文件的问题)配置文件二：config>>index.js(修改assetsPublicPath:‘./‘ ,修改目的是为了解决js找不到的问题)上面两步修改完成之后就...
Vue 代码层面的优化；webpack 配置层面的优化；基础的 Web 技术层面的优化。一、代码层面的优化1.1、v-if 和 v-show 区分使用场景v-if?是?真正?的条件渲染，因为它会确保在切换过程中条件块内的事件监听器和子组件适当地被销毁和重建；也是惰性的：如果在初始渲染时条件为假，则什么也不做——直到条件第一次变为真时，才会开始渲染条件块。 v-show?就简单得多， 不管初始条件是什么，元素总是会被渲染，并且只是简单地基于 CSS 的...
问题描述：前端需要修改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...
例如在修改属性值的时候 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
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 } ...
项目开发完了以后，肯定是要打包的，不然也就失去了项目存在的意义。 上图中的build就是打包的，它会根据你的配制文件生成一个目录，然后目录中就是最终生成的文件，上传到服务器，就可以运行。 但是，一般都是存在各种各样的问题，比较说路径问题，这个是常见的问题。 这个是vue.config.js1、目录路径（静态资源）问题publicPath: 这个是访问的根目录，一开始是/ outputDir：这个是生成的文件放在那个目录下面，如果叫abc，那么生...
在最近做的vue项目中,使用了webpack打包工具,以前在做项目中测试环境和生产环境的接口地址都是一样的,由于现在接口地址不一样,需要在项目打包的时候手动切换不同的地址,有时候忘记切换就要重新打包,来回很是麻烦,今天网上翻看到一个很好的方法可以解决这个问题,也是由于对webpack工具不是很了解,其实这个工具已经提供了解决方案.参考网站:http://blog.csdn.net/gebitan505/article/details/58166055;在config文件夹里面有三个js文件...
业务逻辑 通过gitee创立各个分支，比如swiper，header，recommende等分支，其实就是整个页面上的每个模块。模块化是公司级别项目开发的基准，每个人在各自的分支上进行代码的编写，而对主分支master没有影响。故master分支一般是承载着项目作为基本的代码。 在本个vue的项目中，其页面模板是存储在以下路径 Home.vue作为根模板起到了一个对于别的小模块的整合作用。需要引入模块，在template元素下要使用div进行一个根标签的...