前几天,一位应届生去面试,被问到一个MyBatis中比较基础的问题,说MyBatis中的#号和$符号有什么区别?今天,我给大家来详细介绍一下。...下面我给家详细介绍一下#号和$号的区别, 首先,来看#号,等同于JDBC里面的?号(占位符)。...,前者是动态参数,后者是占位符, 动态参数无法防止SQL注入的问题,所以在实际应用中,应该尽可能的使用#号占位符。...另外,$符号的动态传参,可以适合应用在一些动态SQL场景中,比如动态传递表名、动态设置排序字段等。 2、总结 一些小的细节如果不注意,就有可能造成巨大的经济损失。...在技术如此成熟的互联网时代,还是会有一些网站经常出现SQL注入导致信息泄露的问题。 以上就是我对MyBatis配置#号和$号的理解。
css: #custom_css_source js: #custom_js_source # not used config: # KaTeX config 由于有默认配置...,所以src和config的内容为空。...文章中需要打开公式 这个我本地环境的公式没有生效,文章的Front-matter里打开mathjax开关后成功激活: --- title: Hexo中使用MathJax公式 date: 2017-12-...由于markdown中的下划线 _ 是表示斜体,MathJax中 _ 是表示下标,存在冲突,需要在公式的_前加转义字符,否则显示不正常: 代码: $F_a = F_b + F_c + F_{\mu}...,但是hexo-renderer-markdown-it和hexo-toc会有冲突,需要配置一下解决这个问题: # Markdown-it config ## Docs: https://github.com
自述 Material Card 材料卡是由Google材料团队(也称为mdc-web)提供的卡片样式。 这是一个允许在AngularDart应用程序中使用样式的包装器。...有关如何使用这些样式的文档,请参阅mdc文档。 可以在这里找到示例。 建立 样式由包提供:angular_components/css/mdc_web/card/mdc-card.scss.css。...要在Angular组件中使用这些样式,只需将其添加为Component注解中的styleUrls值即可。我们建议在任何特定于组件的样式之前添加样式,以便您可以根据需要轻松覆盖样式值。...: 'my_component.html', styleUrls: [ 'package:angular_components/css/mdc_web/card/mdc-card.scss.css...', 'my_component.scss.css']) class MyComponent {} MaterialCardExample 查看示例,查看源码。
在 _partials.scss 层(元素、组件等)中,我们主要用到的是 _elements.scss 层,该层中包含诸如通用弹窗、通用表单和通用标题等此类局部模块。...(更多关于文件夹和文件结构的细节,参见我的上一篇文章) 如何组织多个层 在我们的架构中,每个层都至少包含三个文件:两个私有文件(局部样式文件和配置文件,称之为私有是因为它们不会被编译成一个 CSS 文件...|- inherited-project.scss 项目 inherited-project 的配置文件引入了 base-layer 中的配置文件。...Global Story 全局 某些模块并非在所有层中都会用到,因此如果你在基础层中定义它们,其他项目就会导入冗余代码。为了解决这个问题,我走了另一条路线,采用了全局模块的概念。...在开发和后续重构中,每次都要把所有 Sass 根文件一同编译,以免新旧脱节。 总结 在本文中,我向大家展示了针对多网站项目的 CSS 体系结构的构建方法,这套思想提炼于我经年积累的知识和经验。
基于vue-cli的自定义模板(Custom Templates) 小伙伴们的vue项目应该都是用vue-cli初始化出来的,但是vue-cli只是满足了基础配置和功能,如果你有额外的配置需求或者要迎合团队的业务配置...*(js,json)来选择安装哪些配置~ 如果大家懒得去编写vuex,sass的配置,封装axios的话,可以来通过我配置完的脚手架来初始化完项目~ vue init duosanglee/vuejs-custom-template...首先我把组件分为通用组件和业务组件两大类。...然后我把路由里的routes.js和api.js请求文件都单独抽离了出来。...,解决了在项目中后端联调的时候的跨域问题。
webpack 是一个现代 JavaScript 应用程序的静态模块打包器(module bundler)。...当 webpack 处理应用程序时,它会递归地构建一个依赖关系图(dependency graph),其中包含应用程序需要的每个模块,然后将所有这些模块打包成一个或多个 bundle。.../src/index.js' }, 这时候需要在output中的filename中配置 filename: '[name].js' //打包生成目录多个js文件的时候 2.1webpack配置图片...在我的src目录中准备一张图片,在index.js中写入 import avatar from '....limit: 10240 //limit图片大小设置,如果超过10240字节,打包会生成目录和图片,如果没有超过设置的大小,会默认打包压缩在js中的
npm install命令根据这个配置文件,自动下载所需的模块,也就是配置项目所需的运行和开发环境。...在这个JavaScript自动化教程中,你将会学到如何使用 Gulp自动化你的设计和开发流程。如果你更加面向设计,我鼓励你克服你的任何恐惧读下去。...然而,对于捆绑的应用程序,无法达到Gulp提供的可定制性和可扩展性。...在本节中,我们将介绍所有的添加和更改。 return gulp.src(['scss/**/*.scss', '!scss/**/_*']) 在这个例子中,Gulp源提供了一个glob数组。...Karma Gulp-karma 将臭名昭着的测试环境带到Gulp。Karma遵循Gulp也认可的最小配置方法。 结论 在这个过程自动化教程中,我演示了使用Gulp作为构建工具的优美和简单。
Dear,大家好,我是“前端小鑫同学”,长期从事前端开发,安卓开发,热衷技术,在编程路上越走越远~ 写作背景: 现在其实做的不错的开源 UI 库有很多,我还没有真正的实践过多造一个轮子也没太大必要...,但是学习编写的思路和过程还是很有必要的,正好看到慕课的一个视频就顺便总结一下组件库开发的流程,顺便熟悉一个打包的配置和流程。...umd 作为组件输出产物的标识; 输出目录:这里需要注意使用绝对路径来指定输出文件的位置; libraryTarget和library有相互依赖的关系,主要用来指定模块的暴露方式和模块的别名,这一块的描述我觉得...完整的打包配置如下: 配置文件指明了操作的文件入口为css 目录下的 scss 结尾的文件; 文件输出到 dist/css 目录下; 方便执行我们配一下打包命令:"build:css": "npx gulp.../card.scss"; @import "./demo.scss"; 复制代码 按需引入和全部引入: import "..
当 webpack 处理应用程序时,它会递归地构建一个依赖关系图,其中包含应用程序需要的每个模块,然后将所有这些模块打包成一个或多个 bundle。...,还会给出一些额外需要注意的事项,也是我在项目中的踩坑总结。...这里配置有几点需要注意的: 1、动态publicPath 这里说了是多端多页面项目,多端只的就是PC和H5两端,那么这就意味着各端的CDN资源路径是不一样的,所以publicPath值也应该不一样。...对于这个问题,有两种解决办法: 1)使用 resolve-url-loader,将 resolve-url-loader设置于 loader 链中的 sass-loader 之前,就可以重写 url。...但是这个办法有个问题,那就是 resolve-url-loader不识别scss文件的行内注释语法,即 // 注释,这个问题使得接入一些已存在的公共样式库时会存在问题,目前还在研究是否有其他loader
当 webpack 处理应用程序时,它会递归地构建一个依赖关系图,其中包含应用程序需要的每个模块,然后将所有这些模块打包成一个或多个 bundle。...,还会给出一些额外需要注意的事项,也是我在项目中的踩坑总结。...这里配置有几点需要注意的: 1、动态publicPath 这里说了是多端多页面项目,多端只的就是PC和H5两端,那么这就意味着各端的CDN资源路径是不一样的,所以publicPath值也应该不一样。...对于这个问题,有两种解决办法: 1)使用 resolve-url-loader,将 resolve-url-loader设置于 loader 链中的 sass-loader 之前,就可以重写 url。...但是这个办法有个问题,那就是 resolve-url-loader不识别scss文件的行内注释语法,即// 注释,这个问题使得接入一些已存在的公共样式库时会存在问题,目前还在研究是否有其他loader可以解决
在过去的一年和一些人中,我一直在与 Creative Tim 合作。 我一直在使用 create-react-app 来开发一些不错的产品。...在开始处理 Webpack 配置文件之前,先在应用程序中安装一些我们需要的东西。 首先安装 path 作为开发环境的路径依赖。...我们还没有告诉 Webpack 它应该使用 Babel 和样式加载器来编译我们的 React 和 SCSS 代码。 接下来要做的是为 Babel 添加配置文件。...为此,你可以查看官方的 babel-loader 文档。 就我而言,我认为最好将 Babel 配置放在自己的文件中,这样就不会使 Webpack 配置过于复杂难读。...现在我们有两个项目 - Material Dashboard React 和 我们刚创建的项目。
tabBar 这个 tabBar 的配置直接拷贝之前的内容即可,内容如下,很简单就是配置了首页和账号的 tabBar 与首页与账号的页面路由配置: { "pages": [ { "path...首先来看我们的全局样式,例如我有 title 这么一个 class 类名,然后我分别给首页与账号页面进行使用,我只在 App.vue 的 style 中编写了这个 title 类名的样式,那么两个组件所使用的就是...,都可以在 uni.scss 中修改和内置组件是一样的,只不过是同一个人开发的,而 Vue 的内置组件,和饿了么是不同人开发的。....css 文件我这里略过了,和 .scss 文件一样,如上的这个示例是你在不知道可以在 uni.scss 中定义的情况下,那么知道了之后,你就可以不用这么写了,改造一下之前的代码,使用定义在 uni.scss...最后 大家好我是 BNTang, 一个热爱分享的技术的开发者,如果大家觉得我的文章对你有帮助的话,可以关注我的公众号 JavaBoyL,我会在公众号中分享一些IT技术和一些个人的见解,谢谢大家的支持。
而较新的语法叫做“SCSS”,使用和CSS一样的块语法,即使用大括号将不同的规则分开,使用分号将具体的样式分开。通常情况下,这两套语法通过.sass和.scss两个文件扩展名区分开。...但是通过一些配置,我们还是可以从官方脚手架中使用sass/scss/less的。...,请根据预处理的文档替换build-css和watch-css命令。...由于src/app.js仍然 improt src/App.css,所以样式同样成为您的应用程序的一部分。您现在可以编辑src/App.scss,同时会生成相应的src/App.css。...,安装完之后,npm start就可以搞定sass的使用问题了。
,那就是我在variables.scss中定义的变量、在mixins.scss定义的mixin全部失效了,而且控制台也报错: image.png 如果不使用这个变量,我在Chrome是可以看到其他样式已经被编译好的...我们需要在vite的配置文件给css的预处理器进行配置,它的使用方式和Vue CLI中的配置差不多: vite.config.js export default defineConfig({ plugins...,那么需要在Ngnix中配置反向代理,好在后端实现了CORS规范,那我们不需要操心线上的跨域问题了。...当然解决跨域的方式有很多,下面要介绍的WebSocket就没有这个问题。...5.总结 本文主要是对我前三个月所做项目的总结与反省,我从项目搭建角度出发,给大家讲述了如何让项目变得规范和严谨,最后得出一些自己的思考,我希望自己能从这次项目中成长起来,也希望给大家带来一次分享,从中受益
并不会将整个项目的搭建流程细致的写出来,而是挑其中我认为在开发过程中存在的一些很重要的点进行详细陈述。...要解决工程化的问题,需要从两个角度入手:开发 && 部署。 开发 Question 如何提高开发生产效率? 如何降代码维护难度?...完整实现支持scss思路如下: 指定文件处理目录 gulp-replace通过正则匹配@import语句将其注释 判断当前@import语句是否存在于变量和函数文件的配置路径中 不存在就注释,存在就跳过...API地址和ENV环境变量管理 API地址和ENV环境变量可以做为两个单独配置的文件进行配置,API文件只存接口路径,ENV存储多个环境变量,环境对象内配置当前环境各种域名,然后在app.js配置当前环境变量...实现的思路有很多种,主要需要解决的就是环境如何进行切换的问题,在这里我是通过利用小程序的重力感应api模拟摇一摇,将切换环境搓成一个一个隐藏的小彩蛋,测试人员只需要摇一摇弹出环境选项列表点击对应选项更改
在Angular中,组件属于特殊的指令,它的特殊之处在于它有自己的模板(html)和样式(css)。因此使用组件可以使我们的代码具有强解耦、可复用、易扩展等特性。...简单投射 我们先从最简单开始,在 demo.component.html 中添加,修改后的 demo.component.html 和 demo.component.scss 如下: demo.component.html...我们先看个示例,为了区别,我再新增一个蓝色区域的,修改后的 demo.component.html 和 demo.component.scss 如下: demo.component.html: <div...那么知道这个问题,我们可能会想,能不能将外部内容有针对性的投射相应的中呢?答案显然是可以的。 为了处理这个问题,支持一个 select 属性,可以让你在特定的地方投射具体的内容。...因此,投影内容的生命周期将被绑定到它被声明的地方,而不是显示在地方。 这也从原理解释了前面那个问题:如果同时存在几个,那外部内容将如何进行投射呢? 这种行为有两个原因:期望一致性和性能。
我很不喜欢在 js 中写 css。所以,我在项目中构建了 style 文件夹,所有的 scss 文件均放在此处。然后在项目入口中加以引用,即可。...,但是这是有优点,也有缺点的。...@/style/base 目录中的 scss 文件不会自动引入,需要再 @/style/config.scss 文件中手动引入。因为这些基础样式,引用是有顺序要求的,前后颠倒了会出问题。...此外,一些变量等,都可以在 @/style/config.scss 中配置。 建议,除入口scss文件外的所有 scss 文件名以 _ 下划线开头,表示该文件为组件文件,不需要独立编译。...当然,这只是个含义,现代框架库不管这些…… 但有些传统我们是要坚持的(一位逐渐秃顶的前端如是说……) 同自动组件一样,在我这样的规划中,js 和 scss 文件分离了,找起来可能不太好找。
CSS 预处理器语言有 scss(sass)、less 等。...2.SASS和SCSS的区别 除了文件扩展名不同(分别是“.sass” 和 “.scss”)外,Sass是以严格缩进式语法规则来书写的,不带大括号和分号,而SCSS的语法和CSS书写语法类似。...所以我们如果要想再vue项目中使用scss,肯定要告诉vue-loader怎么样解析我的scss文件。 不了解webpack的同学可以先去自行百度。...2.安装SCSS 在webpack中,所有预处理器都要匹配相应的loader,vue-loader允许其他的webpack-loader处理组件中的一部分吗,然后它根据lang属性自动判断出要使用的loaders...的 rules 标签下添加配置。
然而在Sass 与Compass 中,因为配置上的原因,一般是将scss 及css 文件放在以此命名的文件夹中,但WordPress 确是要style.css 放在主题根目录下。...针对上面我提到的问题,css-tricks 上有一个配置代码,能够将编译生成的style.css 自动移动到根目录下;语言是Ruby,如果你也不懂Ruby,那就照猫画虎吧。...,DeveWork.com 诚意出品; */ 其实,我的style.scss 头部是这个: @charset "utf-8";//必须设置了这个才能编译有中文的注释 熟悉的人自然秒懂。...多说一句,如果是想通过书籍学习接触Sass与Compass,可以参考的书籍有两本:上面提到的《Sass与Compass实战》及《Sass和Compass 设计师指南》。时间不够可以只看第一本。...这两本书我都是在学校图书馆借到的,也许多少年后,对于我的大学生涯,我最感激的就是图书馆,以及那些有前瞻视角的图书订购员。
领取专属 10元无门槛券
手把手带您无忧上云