前端新手历险记之在VUE项目中使用Ace编辑器(brace)和一些TypeScript知识点
作者:V君 发布于:2018-9-8 23:52 Saturday 分类:折腾手记
TL;DR
▉ 将Ace编辑器引入项目
1) $npm install brace
2) $npm install --save @types/ace
3) ts:import * as ace from 'brace';
4) ts:import 'brace/...";
▉ TypeScript类型转换,对于 var dom = this.$refs["editor-dom"] 有两种方式
1) ts:ace.edit(dom as HTMLElement);
2) ts:ace.edit(<HTMLElement>dom);//这种方式会使tsx编译器报错标签未关闭,但实际能用
▉ 在TypeScript类中声明可空属性
在标识符后面加感叹号否则必须在构造时初始化,例子:
ts:private editor!: ace.Editor;
虽然这次的收获不多,但还是花了不少时间查资料来弄懂,得好好扯一扯:
在 vue-cli 3.x 创建的项目中启用反向代理
作者:V君 发布于:2018-8-26 21:50 Sunday 分类:折腾手记
TL;DR
1)在项目根目录创建 vue.config.js
2)在文件中指定配置 module.exports -> devServer -> proxy
3)按需增加详细参数 如重写
这次能扯的东西并不多。
主要把时间浪费在咕狗上。什么都不了解就直接搜“vue-cli 反向代理”
粗心大意地忘了加上版本号,首先找到的是在config文件夹创建index.js的方法,没起作用。
后来加上版本号去搜索就发现了vue.config.js,再作为关键字就搜索到了官方文档。
从目录一眼扫下来就发现了遍地文章提到的devServer配置节。
顺便贴一下本次练习中生效的作为参考:
module.exports = { devServer: { port: 8084, proxy: { '/api': { target: 'http://localhost:7808/', changeOrigin: true, pathRewrite: { '^/api': '' }, } } } }
服务端路由为 /md 在前端配置成 /api/md。
或许把前后端路径一致然后去掉pathRewrite参数比较好。
上手VUE前端构建
作者:V君 发布于:2018-8-25 21:46 Saturday 分类:折腾手记
TL;DR
1)到官方网站,下载稳定版本的node安装,选择加到环境变量,然后配置淘宝NPM镜像。
3)使用vue-cli创建项目,然后在VsCode编辑代码。
作为刚入门前端新手会扯得很细,不介意的话可以点进来看看
blogger
咕狗网页翻译
热门日志
随机日志
最新日志
最新评论
- preferences
解决了,谢谢博... - V君
@eses:凑合能用... - eses
无盘系统弄完了... - 逐浪发哥
不错可以用。 - Ninokz
妙啊 - V君
@もるにゃう:可... - もるにゃう
似乎在WIN10 2004版... - V君
@Raymond:hahaha - Raymond
今天网易日推到... - V君
@Ninokz:手动点赞...
分类
存档
- 2021年1月(1)
- 2020年12月(1)
- 2020年11月(1)
- 2020年10月(2)
- 2020年9月(1)
- 2020年8月(1)
- 2020年7月(1)
- 2020年6月(1)
- 2020年5月(1)
- 2020年4月(2)
- 2020年3月(3)
- 2020年2月(1)
- 2020年1月(1)
- 2019年12月(1)
- 2019年11月(1)
- 2019年10月(1)
- 2019年9月(1)
- 2019年8月(2)
- 2019年7月(1)
- 2019年6月(1)
- 2019年5月(1)
- 2019年4月(1)
- 2019年3月(1)
- 2019年2月(1)
- 2019年1月(2)
- 2018年12月(2)
- 2018年11月(1)
- 2018年10月(3)
- 2018年9月(4)
- 2018年8月(6)
- 2018年7月(4)
- 2018年6月(1)
- 2018年5月(2)
- 2018年4月(2)
- 2018年3月(3)
- 2018年2月(1)
- 2018年1月(1)
- 2017年12月(1)
- 2017年10月(2)
- 2017年9月(1)
- 2017年8月(2)
- 2017年7月(1)
- 2017年6月(5)
- 2017年5月(2)
- 2017年4月(2)
- 2017年3月(3)
- 2017年2月(2)
- 2017年1月(2)
- 2016年12月(3)
- 2016年11月(2)
- 2016年10月(3)
- 2016年9月(4)
- 2016年8月(2)
- 2016年7月(4)
- 2016年6月(3)
- 2016年5月(1)
- 2016年4月(4)
- 2016年3月(3)
- 2016年2月(1)
- 2016年1月(5)
- 2015年12月(4)
- 2015年11月(5)
- 2015年10月(1)
- 2015年9月(6)
- 2015年8月(4)
- 2015年7月(1)
- 2015年6月(6)
- 2015年5月(3)
- 2015年4月(3)
- 2015年3月(2)
- 2015年2月(1)
- 2015年1月(3)
- 2014年12月(1)
- 2014年11月(1)
- 2014年10月(1)
- 2014年9月(3)
- 2014年8月(1)
- 2014年7月(1)
- 2014年6月(1)
- 2014年5月(3)
- 2014年4月(1)
- 2014年3月(1)
- 2014年2月(2)
- 2014年1月(1)
- 2013年12月(2)
- 2013年11月(2)
- 2013年10月(1)
- 2013年9月(3)
- 2013年8月(14)
- 2013年7月(7)
- 2013年4月(1)
- 2013年3月(4)
- 2013年2月(6)
- 2013年1月(6)
- 2012年12月(8)
- 2012年11月(6)