项目经验
离子守恒
这个作者很懒,什么都没留下…
展开
-
webpack4利用html-loader实现HTML代码复用同时解决图片失效问题。
webpack处理多页面应用的时候,可以利用html-loader处理每个页面相同的HTML代码,例如header/footer.现在我有一个header,想复用这个header。<header> <div class="intro"> <div class="logo"></div> <div cl...原创 2020-04-03 22:03:09 · 937 阅读 · 1 评论 -
input输入框如何处理中英文输入
input可以监听keydown,keyup,input,change等事件keydown: 键盘按下keyupp: 键盘回弹input: 输入change: 失去焦点触发如果你要通过监听input的value值改变然后发送ajax请求来获取数据,input可以处理,每输入一个字符就触发一次,失去焦点之后也可以触发change发送ajax。但是这是面对英文输入,当遇到中文输入的时候,按...原创 2020-04-03 16:43:54 · 1672 阅读 · 0 评论 -
webpack4多页面应用--多个页面需要同一份代码,如何处理
问题:多页面应用中每一个HTML页面需要引入同一份js文件,如何利用webpack处理这一份js文件。解决:1.首先将这份代码放到一个js文件中,然后将这份文件单独配置一个出口文件。import $ from 'jquery';import './../style/header.scss';function createHeader() { return `<header&...原创 2020-04-03 14:25:24 · 227 阅读 · 0 评论 -
webpack4中多页面应用引入jq
引入jquery需要expose-loadernpm i expose-loadr -Dwebpack.config.jsmodule: { rules: [ { text: require.resolve('jquery'), use: [{ loader: 'expose-loader', //暴...原创 2020-04-03 14:12:28 · 252 阅读 · 0 评论 -
a标签点击之后颜色不变
a:link{ color: #fff;}a:visited{ color: #fff;}a:hover{ color: #fff;}a:active{ color: #fff;}顺序不能改变原创 2020-03-28 15:51:26 · 5057 阅读 · 0 评论 -
子元素position为fixed时,宽度如何保持与父元素一致。
position: fixed是生成绝对定位的元素,相对于浏览器窗口进行定位。如果设置宽度100%,宽度会超过父元素如果设置宽度width: inherit,会继承父元素宽度原创 2020-03-28 11:22:01 · 8800 阅读 · 6 评论 -
webpack将CSS文件打包到指定文件夹
插件mini-css-extract-pluginconst MiniCssExtractPlugin = require('mini-css-extract-plugin');module.exports = { module: { rules: [ { test: /\.css$/, // use: ['style...原创 2020-03-26 13:48:43 · 2937 阅读 · 0 评论 -
webpack如何将js文件单独打包到指定文件夹
module.exports = { entry: { main: './src/main.js', index: './src/index.js' }, output: { //前面添加路径,最后js生成在dist/js文件夹下 filename: 'js/[name].js', path: path.resolve(__dirname, 'dist') }}...原创 2020-03-26 13:30:14 · 4248 阅读 · 0 评论 -
webpack如何将HTML文件单独打包到指定文件夹
html文件的打包js文件的打包css文件的打包字体文件的打包html文件的打包:html-webpack-pluginconst path = require('path')const HTMLWebpackPlugin = require('html-webpack-plugin');module.exports = { entry: { main: './src/m...原创 2020-03-26 13:27:38 · 1373 阅读 · 0 评论 -
关于webpack的output和devServer的配置
最近利用webpack搭建一个开发环境,实现本地服务器的开启。webpack的本地服务器用的是express,但下面遇到的问题跟express应该没什么关系。这里有几个问题,现在通过文章来一一解决。1.我写一个html文件,webpack只认识js文件,那我如何处理html文件。答:通过插件html-webpack-plugin来处理html文件。他能够单独生成HTML文件const p...原创 2020-03-26 13:24:59 · 544 阅读 · 0 评论 -
搭建前端服务器和后端服务器实现通讯
前端:如果是使用webpack或者vue-cli的,直接运行本地服务器就可以了。后端:node app.js启动服务在前端发送ajax,后端设置跨域即可实现通讯。res.setHeader(“Access-Control-Allow-Origin”,"*");...原创 2020-03-25 11:05:21 · 1558 阅读 · 0 评论 -
关于搭建服务器
想搭建一个服务器,来展示网页。百度一下服务器,有apache,tomcat各种各样的,但是用哪种服务器呢?服务器分两种,一种是web服务器,一种是应用服务器。(我自己了解就这样种,因为我要用到,其他服务器类型就不清楚了)web服务器一般是用来处理HTTP请求,然后返回静态资源(例如html文件)。应用服务器就是用来处理动态请求的,然后返回动态资源(例如php)。静态资源或者说静态网页,就...原创 2020-03-23 22:15:45 · 128 阅读 · 0 评论 -
关于轮播图
1.事件绑定<li onclick="move()"></li>左边是事件,右边是处理函数,需要加括号,如果要获取事件对象,就把event传进去,如果要获取this,就把this传进去。2.HTML自定义属性要获取标签的自定义属性,要用getAttribute(),修改要用setAttribute()。3.给DOM元素增加或者删除class用DOM.classL...原创 2020-02-13 00:07:54 · 130 阅读 · 0 评论