- 博客(22)
- 收藏
- 关注
RSS订阅原创 Element-UI基本使用
Element-UI基本使用npm i element-ui -S 安装element-ui导入element-ui相关资源//导入组件库import ElementUI from 'element-ui';//导入组件相关样式import 'element-ui/lib/theme-chalk/index.js';//配置vue插件Vue.use(ElementUI)...
2020-03-30 22:58:17
167
原创 vue脚手架自定义配置
vue脚手架自定义配置package.json文件中添加vue节点"vue":{ //项目服务器配置 "devServer:{ "port":8888, //默认打开浏览器 "open":true }}新建单独的vue配置文件vue.config.jsmodule.exports = { "devServer":{ "port":5154, "ope...
2020-03-30 22:44:20
522
原创 webpack打包发布
webpack打包发布通过pack.json文件中配置打包命令"scripts":{ //该命令默认加载项目根目录的webpack.config.js配置文件，当前项目中如果有dist目录，先删除，运行该命令会自动生成dist目录，此时的dist就是成品的项目 "build":"webpack -p"}...
2020-03-30 21:50:37
143
原创 webpack配置vue组件加载器
webpack配置vue组件加载器npm i -D vue-loader vue-template-compilerwebpack.config.js文件添加vue-loader配置const VueLoderPlugin = require('vue-loader/lib/plugin');module.exports = { modules:{ rules:[ {tes...
2020-03-30 21:32:33
252
原创 vue单文件组件
vue单文件组件组成结构1.template 组件的模板区域2.script 组件的业务逻辑区3.style 组件的样式区<template></template><script>export default{ data(){ //存私有数据 return{} }, methods:{ //处理函数 }}</scr...
2020-03-30 21:27:53
104
原创 webpack打包处理jjs文件中的高级语法
webpack打包处理jjs文件中的高级语法npm i babel-loader @babel/core @babel/runtime -D安装babel转换器相关的包npm i @babel/preset-env @babel/plugin-transform-runtime @babel/plugin-proposal-class-properties -D安装babel语法插件相关...
2020-03-30 21:06:57
302
原创 webpack打包处理原始表中的图片和字体文件
webpack打包处理原始表中的图片和字体文件npm i url-loader file-loader -Dwebpack.config.js中添加规则{test:/\.jpg|png|gif|bmp|ttf|eot|svg|woff|woff2$/,use:'url-loader?limit=16940'}备注：？之后时loader的参数项limit用来指定图片大小，单位为字...
2020-03-30 20:42:52
151
原创 webpack配置postcss自动添加css的兼容前缀
webpack配置postcss自动添加css的兼容前缀npm i - D postcss-loader autoprefixer项目根目录创建pastcss.config.css配置文件const autoprefixer = require('autoprefixer);module.exports = { plugins:[autoprefixer];}eg ::pla...
2020-03-30 20:29:48
257
原创 webpack打包处理scss文件
webpack打包处理scss文件npm i -D sass-loader node-sasswebpack.config.js添加规则{test:/\.scss$/,use:['style-loader','css-loader','sass-loader']}3.导入sass文件，npm run dev运行项目...
2020-03-30 20:12:29
359
原创 webpack打包处理css文件
webpack打包处理css文件npm i -D style-loader css-loader安装css依赖的加载器webpack.config.js添加module节点，节点下添加rules属性，rules属性中添加规则 module:{ rules:[ {test:/\.css$/,use:['style-loader','css-loade...
2020-03-30 20:03:27
143
原创 webpack打包处理less文件
webpack打包处理less文件npm i -D style-loader css-loader less-loader安装less依赖的加载器webpack.config.js文件中添加规则{test:/\.less$/,use:['style-loader','css-loader','less-loader']}直接导入less文件，npm run dev运行项目...
2020-03-30 19:59:43
329
原创 webpack配置html-webpack-plugin生成预览页面
webpack配置html-webpack-plugin生成预览页面npm i html-webpack-plugin -D安装生成预览页面的插件修改webpack.config.js文件的头部区域，添加如下配置const HtmlWebpackPlugin = require('html-webpack-plugin);const htmlplugin = new HtmlWebp...
2020-03-30 14:33:54
354
原创 webpack配置自动打包功能
webpack配置自动打包功能步骤npm install webpack-dev-server -D,安装支持项目自动打包的工具修改package.json -> srcipts中的dev命令“script”:{ "dev":"webpack-dev-server"}把src的index.html 文件中src的脚本引用路径改为“/bundle.js”运行npm ru...
2020-03-30 14:19:47
163
原创 webpack配置打包的入口和出口
webpack配置打包的入口和出口webpack的4.x版本中默认约定打包的入口文件是src ->index.js打包的出口文件是dist ->main.js如果要修改打包的入口和出口，可以在webpack.config.js新增如下配置//node中专门操作路径的模块const path = require('path);module.exports = { //...
2020-03-30 14:03:37
692
原创 ES6模块化基本语法
1.默认导出与默认导入默认导出：export default 默认导出的成员默认导入：import 接收名称 from ‘模块标识符’如：（1）m1.jslet a=10;let b=20;function c(){console.log('这是c的内容');}export default { a, b, c}(2)m2.jsimport m1 from ...
2020-03-30 13:46:49
881
原创 node中使用babel
node中使用babel实现模块化npm install --save-dev @babel/core @babel/cli @babel/preset-env @babel.node安装babel相关的依赖包npm install --save @babel/polyfill安装第三方插件项目根目录下创建文件babel.config.jsbabel.config.js文件内容如下c...
2020-03-30 13:31:20
284
原创 webpack 基本使用
**## webpack 基本使用步骤：运行npm install webpack weback-cli -D，安装webpack相关的包在项目根目录创建名为webpack.config.js的webpack配置文件在webpack的配置文本中，初始化如下配置module.exports = {//mode用来指定s构建模式mode:'development}package.j...
2020-03-30 13:19:55
290
原创 弄懂art-template前后端混合使用之后，使用mongodb数据库，Node.js，AJAX,art-template实现省市区三级联动
弄懂art-template前后端混合使用之后，完成的这个案例首先，页面用服务器端渲染，拿到省份信息，渲染到页面其次，客户端省份信息选择之后调用城市接口，获取数据，渲染到页面，注意，（1）在客户端没有选中时让城市的下拉框清空，避免省份还在提示请选择省份时，城市诓就有信息（2）省份框选中时，让县城框清空，同样，避免还未选城市呢，县城信息就出来然后，选择了城市之后，调接口用数据渲染县城框服务器...
2020-03-16 01:32:23
395
原创 js实现免登陆效果
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title></head><body>用户名：<input type="text"><br/>密&am...
2019-05-21 01:15:26
1705
原创 css实现图片悬浮效果
css实现图片悬浮效果HTML代码<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title> <link rel="stylesheet" href="index.css">&l...
2019-05-20 22:44:16
13269
原创 js实现鼠标拖拽移动元素位置
在移动的元素触发鼠标按下事件，给document绑定鼠标移动事件（给document绑定事件让元素可以随着鼠标在整个页面上进行移动，如果是给元素直接绑定鼠标移动事件那么元素只能一直是跟着鼠标下移，局限性太大，可以自己试试），鼠移动时让元素跟着鼠标移动，当鼠标抬起时元素停止到该位置。//注意：使用style给元素设置位置等样式时必须在html元素上设置相应的行内样式。eg:box。style.top = 100+"px"，则必须要再box1上添加 style = “left ：0px;”
2019-05-20 18:10:47
4535
1
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人