![](https://img-blog.csdnimg.cn/20201014180756919.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
前端框架
文章平均质量分 50
前端框架,React,Vue,前端知识,提升与项目
离开你,我才发现
bug, 不破, 不回头 个人博客jkraise.top
展开
-
webpack配置02
加载picture文件webpack5使用四种新增的资源模块(Asset Modules)替代了这些loader的功能。asset/resource 将资源分割为单独的文件,并导出url。asset/inline 将资源导出为dataURL(url(data:))的形式,asset/source 将资源导出为源码(source code).asset 自动选择导出为单独文件或者 dataURL形式(默认为8KB).module: { rules: [ {原创 2021-12-23 11:11:53 · 432 阅读 · 0 评论 -
webpack配置基础01
webpack主要功能:它提供了友好的前端模块化开发支持,以及代码压缩混淆、处理浏览器端JavaScript的兼容性、性能优化等强大的功能。3.在项目中安装 webpack在终端运行如下的命令,安装webpack相关的两个包:npm install webpack@5.42.1 webpack-cli@4.7.2-save-dev-S 是–save的简写-D 是–save-dev的简写在项目中配置 webpack创建webpack.config.js 文件2. module.expor原创 2021-12-23 11:10:40 · 210 阅读 · 0 评论 -
Vue路由懒加载&&路由守卫
路由懒加载有时候有些路由下的组件需要打包在同个异步块(chunk)中,使用webpackChunkName 语法使用懒加载,const Foo = () => import(/* webpackChunkName: "group-foo" */ './Foo.vue')const Bar = () => import(/* webpackChunkName: "group-foo" */ './Bar.vue')const Baz = () => import(/* webpac原创 2021-12-23 11:09:31 · 463 阅读 · 0 评论 -
VueRouter的进阶使用
命名路由const routes = [ { // 路由参数,user_id path: "/user/:user_id", // 给路由起别名 name: "user", component: User, // 使用props 传参 props: true, }]使用路由<div> <router-link to="/">主页</router-link> <!--params 传参数-->原创 2021-12-23 11:08:34 · 492 阅读 · 0 评论 -
vue-cli 项目 使用的vue add router&&配置VueRouter
1.安装路由npm i vue-router注意vue-cli 项目,使用的vue add router添加vue Router,但是它会覆盖你的App.vue,因此提前备份这个文件,在运行此命令2.在src中,创建Routers文件夹下创建index.js3.在src目录下创建 组件/src/views/Home.vue /src/views/About.vue 4.在Routers文件夹下创建index.js中导入 VueRouter、组件, 定义路由import VueRouter原创 2021-12-23 11:07:18 · 989 阅读 · 0 评论 -
Vue异步操作&&promise使用
异步操作异步的执行流程1.先执行同步任务2.再执行异步任务异步任务分为 微任务, 宏任务先执行微任务再执行 宏任务微任务 有 promise MutationObserver宏任务 有 定时器 DOM事件回调微任务,是一个任务队列,先进先出,3.javascript 单线程模型promisepromise是什么?1、主要用于异步计算2、可以将异步操作队列化,按照期望的顺序执行,返回符合预期的结果3、可以在对象之间传递和操作promise,帮助我们处理队列为什么会转载 2021-12-23 11:05:40 · 533 阅读 · 0 评论 -
nodeStudy Day01
node Study__dirname 当前js文件所在绝对路径path模块const path = require('path'); // 导入path模块let url = path.join(__dirname, 'a','b'); // 拼接字符串console.log(url) // E:\NodeDay01\a\bhttp 开启服务器art-template 是一个简约、超快的模板引擎// 1. 引入模块var fs = require('fs')原创 2021-12-10 15:16:18 · 85 阅读 · 0 评论 -
Vue事件对象&&动效Transtion组件的理解
事件对象 在函数只有一个参数的,可以不写$evnet<button @click="handleClick('阿元', $event)">按钮</button> <script> let app = new Vue({ el: "#app", data: { name: "hello word", msg: "<em>.原创 2021-12-10 15:04:59 · 187 阅读 · 0 评论 -
Vue组件通信-简单使用,
组件通信父给子组件通信子组件通过props属性接收var father = { template: ` <div> <button @click="handleClick"></button> <!-- 静态传值 zhangsan --> <son name="name"></son> <!-- 动态传值 zhangsi --> <son :name="name原创 2021-12-07 20:46:34 · 388 阅读 · 0 评论 -
事件js进阶
事件js1.addEventListener() 事件监听button.addEventListener('click',function(){ console.log("监听事件---1")}) 事件监听2.事件解绑(removeEventListener)button<script> let fn = function(){ div.classList.toggle("active"); } add.addEventListen原创 2021-11-05 20:37:40 · 88 阅读 · 0 评论 -
React语法(进阶)
React语法一,什么是react1. React的特点1,声明式2. 基于组件3. 学习一次,随处使用二,React的使用1. React的安装npm i react react-domreact 包是核心,提供创建元素,组件等功能React-dom包提供DOM相关功能等<body> <div id="root"></div> <!-- 1. 引入js文件 --> <script sr原创 2021-09-29 17:38:29 · 237 阅读 · 0 评论 -
前端工程化(Vue3.0项目,Vue2.0项目)
前端工程化实际的前端开发:模块化|(js的模块化、Css的模块化、资源的模块化)组件化(复用现有的UI结构、样式、行为)规范化(目录结构的划分、编码规范化、接口规范化、文档规范化、Git分支管理)自动化(自动化构建、自动部署、自动化测试)webpack主要功能:它提供了友好的前端模块化开发支持,以及代码压缩混淆、处理浏览器端JavaScript的兼容性、性能优化等强大的功能。3.在项目中安装 webpack在终端运行如下的命令,安装webpack相关的两个包:npm install原创 2021-09-29 11:43:34 · 438 阅读 · 0 评论 -
好客租房-React-移动web项目
好客租房-React-移动web项目技术栈React 核心库:react、react-dom、react-router-dom脚手架:create-react-app·数据请求:axios·Ul组件库:antd-mobile·其他组件库:react-virtualized、formik+yup、react-spring等·百度地图API组件库 antd-mobile1.打开 antd-mobile的文档2.安装 npm i antd-mobile2.2嵌套路由使用步骤1.在pa原创 2021-09-29 11:28:54 · 969 阅读 · 0 评论 -
微信小程序-微信小程序
微信小程序知识点 总结微信小程序开搞 按思路来2,web 与小程序的不同3,最后利用 判断时间戳原创 2021-09-26 18:08:41 · 204 阅读 · 0 评论 -
移动端 开发流程(高效的方式,心情美好)
移动端 开发流程蓝湖/摹客协作平台UI设计师 psd效果图完成后,会上传到蓝湖//摹客里面,同时会拉前端工程师进入开发大部分情况下,UI会把图片按照前端设计要求给切好UI设计师 上传蓝湖到或者/摹客(了解)幕客 https://www.mockplus.cn/蓝湖 https://lanhuapp.com/这里以 幕客为例注册账号 ,下载ps插件PS 安装/摹客/蓝湖插件打开PS/摹客/蓝湖插件上传(需要切图,需要先标注切图)查看项原创 2021-09-26 17:49:33 · 185 阅读 · 0 评论 -
Vue 前端框架神器(前端必备)
Vue 前端框架神器前提引入Vue<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>定义div 标签,设置好选择器 可以用类也可以是其它的选择器在js中使用view 提供数据<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script><script>原创 2021-04-02 16:55:02 · 181 阅读 · 0 评论