- 博客(14)
- 收藏
- 关注
原创 yml基本语法
基本语法: key: value: 表示键值对,冒号后面必须有空格 和python语法类似,以空格缩进来控制层级关系 属性和值大小写敏感,例如: server: port: 8080 path: /hello 字面量:普通的值(数字,字符串,布尔值) 字符串默认不用加单引号或双引号 若为双引号,则不会转义特殊字符 若为单引号,会转移特殊字符 对象、Map(属性和值) 先写对象名,另起一行再写每一个属性和值,例如:friends: name: Tom age: 20 如果写在一行里面,
2021-01-05 09:14:53
362
原创 Vue项目中index.html、main.js与App.vue关系
index.html: 这里面的<div id="indexHtmlOfApp"></div>就是即将要挂载vue组件的地方,页面加载时,首先会加载index.html页面,即使区域中有元素,也会被App.vue组件里的元素所替换 App.vue: App.vue是根组件,id是app,所有的组件都可以在此之下定义,通过路由进行跳转页面 main.js 连接了index.html和App.vue的桥梁, import App from './App' import rout
2020-11-03 22:59:20
425
原创 Vue脚手架介绍与基本用法
介绍: vue脚手架自动创建vue+webpack项目,免去繁琐的各种配置和依赖下载 详细可见:脚手架官网 安装: 此命令默认安装最新版: npm install -g @vue/cli 推荐采用3.x以上版本 基于3.x版本创建vue项目: 基于命令行方式: 命令行执行:vue create project_name 会出现默认方式还是手动方式,可通过键盘上下键进行选 选择手动方式 可以通过空格键进行选中,星号代表已经选中,这里选择可以选择路由 5.选择vue.js版本,默认即可:
2020-10-29 16:19:26
466
原创 Vue组件
组件注册: Vue.component(组件名, { data: 组件数据, template: 组件模板内容 }) 例: Vue.component('button-counter', { data: function(){ return { count: 0 } }, template: '<button> @click="counter"> 点击了{{count}}次></button>', methods: { counter: f
2020-10-26 10:56:32
100
原创 webpack打包发布
在项目上线之前需要将应用整体进行打包,可以通过package.json文件配置打包命令: "scripts": { "build": "webpack -p" } 注意: 该命令默认加载项目根目录中的webpack.config.js配置文件
2020-10-23 14:14:33
118
原创 webpack项目中使用vue
install: npm i vue -S 在src->index.js入口文件中,通过 import Vue from 'vue导入vue 创建vue实例对象,并指定要控制的el区域 通过render函数渲染app根组件 render函数渲染: 导入Vue构造函数:import Vue from ‘vue' 导入App根组件:import App from 'App.vue 实例化对象: const vm = new Vue({ el: '#app', }) render: h =>
2020-10-23 14:06:30
87
原创 postCSS自动添加css兼容前缀
简介: 不同的浏览器对样式表的兼容性不一样,需要手动添加浏览器前缀,较为麻烦,使用webpack加载器配置postCSS自动添加css兼容前缀较为方便 安装: npm i postcss-loader autoprefixer -D 在项目根目录中创建postcss的配置文件postcss.config.js,并初始化配置: const autoprefixer = require('autoprefixer') module.exports = { plugins: [autoprefixe
2020-10-22 20:39:48
1211
原创 webpack加载器
webpack默认只能打包js文件,对于非js文件只能调用loader加载器才能打包,否则就会出错 loader加载器: less-loader:打包处理.less相关 sass loader:打包处理.sass相关 url-loader:打包处理css中与url路径相关的文件 打包.css文件 安装加载器 npm i style-loader css-loader -D 2.修改webpack.config.js中的module->rules数组 module.exports = {
2020-10-22 18:45:09
227
原创 webpack基本使用——配置生成预览页面
安装 npm install html-webpack-plugin -D 修改webpack.config.js const HtmlWebpackPlugin = require('html-webpack-plugin');//导入插件 const path = require('path'); //创建插件实例对象 const htmlPlugin = new HtmlWebpackPlugin({ template:'./src/index.html',//指定显示首页 filename: '
2020-10-22 16:38:47
186
原创 webpack基本使用
基本使用 新建项目空白目录,并运行npm init -y命令初始化包管理配置文件package.json 新建src源代码目录 在src目录下,新建index.html首页 初始化首页基本结构 执行npm i webpack webpack-cli -D 安装webpack包 在项目根目录创建名为webpack.config.js配置文件,并在该文件中初始化以下配置: ` module.exports = { mode: 'development }'` development为开发环
2020-10-22 15:04:49
293
1
原创 node.js中使用ES6模块化规范
node.js中使用ES6模块化规范node.js中使用ES6模块化规范 node.js中使用ES6模块化规范 ES6介绍: 是通用的模块化规范,同时适合于服务器端和浏览器端, 每个js文件都是一个独立的模块 导入模块 使用import 关键字; 暴露模块成员使用 export 关键字; node.js使用ES6模块化——babel 1.首先命令行中执行:npm install --save-dev @babel/core @babel/cli @babel/preset-env @babel/
2020-10-21 21:09:10
619
原创 MySQL 常用数据存储引擎区别
mysql 有多种存储引擎,目前常用的是 MyISAM 和 InnoDB 这两个引擎 MyISAM 锁级别为表锁,表锁优点是开销小,加锁快; 缺点是锁粒度大,发生锁冲动概率较高,容纳并发能力低; 这个引擎适合查询为主的业务。此引擎不支持事务,也不支持外键。 MyISAM强调的是性能,每次查询都具有原子性,其执行速度比InnoDB类型更快 InnoDB 存储引擎最大的亮点就是支持事务,支持...
2019-05-16 22:53:30
168
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人