- 博客(33)
- 收藏
- 关注
原创 vue3 nuxt3子组件使用emit报warningExtraneous non-emits event listeners were passed to compont but could...
Extraneous non-emits event listeners (chooseRadio) were passed to component but could not be automatically inherited because component renders fragment or text root nodes. If the listener is intended to be a component custom event listener only, declare i
2023-11-22 14:18:02 305
转载 git checkout 提示 “error: The following untracked working tree files would be overwritten by checkout”
git
2022-07-04 16:15:24 1889
原创 webpack基础(10).拆分环境变量和生产环境配置
一、公共路径可以看到根据前几掌的学习,dist/app.html 引用的资源都是通过相对路径来引用的。如果想要使用 CDN 的路径或者当前服务器的路径,来作为link上面的路径前缀,就可以使用publicPath。publicPath:可以用来指定应用程序中所有资源的基础路径。webpack.config.jsexport default {// ... output: { // ... publicPath: 'http://localhost:8080/' }}打
2022-05-11 21:54:53 572
原创 webpack基础(9).缓存
webpack打包后,会生成一个 dist 目录,打包后的内容就会放置在这个目录下。只要 dist 目录中的内容部署到了 server 上,client (通常指浏览器)就能够访问这个server 的网站及其资源。然鹅获取资源这一步是比较耗费时间的,因此浏览器使用了缓存技术,降低网络流量,让页面加载更快。但是,如果我们部署的时候不更新文件名,浏览器就可能会认为这个文件没有修改,就会使用这个文件的缓存版本。这样就没有用到我们的新代码。因此,本章通过必要的配置,确保 webpack 编译生成的文件既能够
2022-05-10 21:20:54 506
原创 webpack基础(7).使用babel-loader
Webpack 自带加载 js模块 的功能,但是他只能做 js模块化 的打包,并不能转换 js 里面的代码,比如将 ES6 转换成 ES5。有时候我们的代码还能运行,这纯靠浏览器的解析。如果浏览器版本比较低的话,运行的时候就会发生错误。因此,我们写代码的时候是需要转化的,这个转换的工具,就是babel。babel 和 webpack 的结合,就需要一个 babel-loader。一、babel-loader安装npm install -D babel-loader @babel/core @b
2022-05-07 22:01:03 2040
原创 webpack基础(6).资源管理(loader)
一、什么是loaderwebpack只能理解 js 和 json 文件,这是webpack自带的能力。loader可以让webpack处理其他类型的文件,并对其转换成有效的模块,让应用程序使用,以及添加到依赖图中。loader的属性:在webpack的配置中,loader有两个属性。test: 表示哪些文件会被转换。use: 表示使用什么 loader 进行转换。例子:const path = require('path');module.exports = { output: {
2022-05-06 21:30:53 369
原创 webpack基础(4).mode选项
在前几章的学习中,我们有很多的手动操作的地方。比如访问html需要手动复制路径访问;更新了文件之后,需要手动执行编译命令,而且只能手动刷新浏览器才能看到新的效果…mode: development 使webpack的编译模式改为开发环境使用source map编译后看到bundle.js中显示的代码,它和源代码并不一致,因此并不易于调试和查看。这时候可以用source map让编译后的代码和源文件内容一样,且精准锁定出错代码的位置:devtool: inline-source-mapwa
2022-04-28 21:16:32 303
原创 Webpack基础(3). 自动引入资源(webpack插件)
一. 什么是插件随着应用程序的增长,如果继续手动地在 index.js 里面引入插件就会越来越困难,因此我们想要自动引入插件,那么就可以使用 webpack插件 。webpack插件什么是插件呢?webpack 就像一条生产线,要经过一系列的处理流程后,才能将入口文件转换为输出的结果。例如上一篇中,入口文件 index.js,需要依赖于 hello-world1.js 和 hello-world2.js 两个 js 文件,而依赖的这两个 js 文件可能还会依赖于其他的 js 文件以及 css 文件,
2022-04-26 21:15:26 1883
原创 Webpack 基础(2).小试webpack
提示:文章写完后,目录可以自动生成,如何生成可参考右边的帮助文档文章目录一、安装Nodejs二、安装Webpack三、自定义Webpack配置总结一、安装Nodejswebpack是基于node来开发的,所以先安装node.js的环境。node.js选择版本。node.js官网地址常识科普:LTS (Long Terms Support):长期支持,推荐使用。(安装有问题的话,步骤可以看看别的博客)安装完了,看一下 node.js 和 npm 的版本号node -vnpm -v.
2022-04-25 20:59:44 1125
原创 vue中定时请求数据 --- setInterval
问题发现我是在mounted用setInterval给方法定时,需要注意的是setInterval的指向这样可以:data() { return { timer: null }},mounted() { // *5分钟定时刷新投诉条数 this.timer = setInterval(() => { this.getCount(); }, 300000) }, beforeDestroy() { clearInterval(this.ti
2022-02-24 15:20:05 2035
原创 使用css修改svg颜色
直接用css控制svg标签下g标签的stroke属性:svg g { stroke: red;}另法:如果svg可以自己在代码里面操控,也可以直接在svg标签下的g标签加stroke=”red“,像这样:
2022-02-09 14:00:14 9439 1
原创 安装Node环境遇到的问题
安装Node环境遇到的问题a later version of node.js has installed下载地址新的改变功能快捷键合理的创建标题,有助于目录的生成如何改变文本的样式插入链接与图片如何插入一段漂亮的代码片生成一个适合你的列表创建一个表格设定内容居中、居左、居右SmartyPants创建一个自定义列表如何创建一个注脚注释也是必不可少的KaTeX数学公式新的甘特图功能,丰富你的文章UML 图表FLowchart流程图导出与导入导出导入遇到的问题a later version of node.
2022-01-17 10:46:54 2201 2
原创 vue+element ui 小问号提示
效果:代码:<el-form-item label="域类型"> <el-select v-model="temp.fieldType" class="filter-item"> <el-option v-for="item in fieldTypeList" :key="item.value" :label="item.label" :value="item.value" /> </el-sel
2020-08-07 20:48:58 9896 3
原创 vue element ui实现隐藏列
vue element ui实现隐藏列<el-table-column v-for="col in columnDefs" :key="col.prop" :label="col.label" align="center" :show-overflow-tooltip="col.showOverflowTooltip"> <template slot-scope="{row}"> <span>{{ row[
2020-08-03 21:10:49 2220
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人