关于TypeScript中import JSON的正确姿势详解


Posted in Javascript onJuly 25, 2017

前言

Typescript是微软内部出品的,用actionscript的语法在写js的一门新语言,最近 TypeScript 中毒,想想我一个弱类型出身的人,怎么就喜欢上了类型约束……当然这不是重点,重点可能还是 JS 没有接口,我没法靠 class 语法糖写的非常 OO……下面这篇文章想说的其实是在 ts 中如何正确的 import json 格式。

首先我使用了基本姿势

import * as variable from './fooooooo.json'

结果发现他提示我并没有这个 module(Cannot find module),咋回事呀大佬,明明 JavaScript 中我可以正常使用。

查了一下,找到了一个方法:

命名一个 typings.d.ts:

declare module "*.json" {
 const value: any;
 export default value;
}

接下来理论上你就可以愉快的使用了,比如

import * as variable from './fooooooo.json'
const data = (variable as any).data

当然在使用中由于我不小心写错了 config 文件的文件名所以没有生效于是……我又去找了别的方法。

比如可以使用 @types/node 加上 require 引入,如果你的服务中禁用 any,这也是一个比较好的方法。

甚至你可以手写读取文件,不过感觉上去还是比较智障……还是觉得前面两种方法更优雅一点

总结

以上就是这篇文章的全部内容了,希望本文的内容对大家的学习或者工作能带来一定的帮助,如果有疑问大家可以留言交流,谢谢大家对三水点靠木的支持。

Javascript 相关文章推荐
JS高级笔记
Jul 13 Javascript
js特效,页面下雪的小例子
Jun 17 Javascript
Node.js的Express框架使用上手指南
Mar 12 Javascript
JavaScript提升性能的常用技巧总结【经典】
Jun 20 Javascript
微信小程序  audio音频播放详解及实例
Nov 02 Javascript
Vue关于数据绑定出错解决办法
May 15 Javascript
关于前后端json数据的发送与接收详解
Jul 30 Javascript
vue+element-ui集成随机验证码+用户名+密码的form表单验证功能
Aug 05 Javascript
如何优雅的在一台vps(云主机)上面部署vue+mongodb+express项目
Jan 20 Javascript
jquery使用echarts实现有向图可视化功能示例
Nov 25 jQuery
Vue+Node实现的商城用户管理功能示例
Dec 23 Javascript
解决vuex数据页面刷新后初始化操作
Jul 26 Javascript
微信JSSDK调用微信扫一扫功能的方法
Jul 25 #Javascript
利用node.js爬取指定排名网站的JS引用库详解
Jul 25 #Javascript
详解angularjs获取元素以及angular.element()用法
Jul 25 #Javascript
以BootStrap Tab为例写一个前端组件
Jul 25 #Javascript
基于Bootstrap的标签页组件及bootstrap-tab使用说明
Jul 25 #Javascript
js事件委托和事件代理案例分享
Jul 25 #Javascript
基于JavaScript实现多级菜单效果
Jul 25 #Javascript
You might like
php 获取可变函数参数的函数
2009/08/26 PHP
php中随机函数mt_rand()与rand()性能对比分析
2014/12/01 PHP
PHP提示Warning:phpinfo() has been disabled函数禁用的解决方法
2014/12/17 PHP
PHP如何将log信息写入服务器中的log文件
2015/07/29 PHP
两种php去除二维数组的重复项方法
2015/11/04 PHP
php根据年月获取当月天数及日期数组的方法
2016/11/30 PHP
php读取出一个文件夹及其子文件夹下所有文件的方法示例
2017/06/15 PHP
JS 字符串连接[性能比较]
2009/05/10 Javascript
基于jquery插件实现常见的幻灯片效果
2013/11/01 Javascript
调用DOM对象的focus使文本框获得焦点
2014/02/19 Javascript
JavaScript中Boolean对象的属性解析
2015/10/21 Javascript
极力推荐一款小巧玲珑的可视化编辑器bootstrap-wysiwyg
2016/05/27 Javascript
JavaScript实现简单的文本逐字打印效果示例
2018/04/12 Javascript
父组件中vuex方法更新state子组件不能及时更新并渲染的完美解决方法
2018/04/25 Javascript
laydate如何根据开始时间或者结束时间限制范围
2018/11/15 Javascript
微信小程序官方动态自定义底部tabBar的例子
2019/09/04 Javascript
vue项目中使用rem,在入口文件添加内容操作
2020/11/11 Javascript
用javascript实现倒计时效果
2021/02/09 Javascript
Python使用os模块和fileinput模块来操作文件目录
2016/01/19 Python
在python中使用正则表达式查找可嵌套字符串组
2017/10/24 Python
Python决策树分类算法学习
2017/12/22 Python
Python爬取豆瓣视频信息代码实例
2019/11/16 Python
Python数据库封装实现代码示例解析
2020/09/05 Python
全球速卖通西班牙站:AliExpress西班牙
2017/10/30 全球购物
PAUL HEWITT手表美国站:德国北部时尚生活配饰品牌,船锚元素
2017/11/18 全球购物
英国假睫毛购买网站:FalseEyelashes.co.uk
2018/05/23 全球购物
俄罗斯有趣和原创礼物网上商店:MagicMag
2019/08/01 全球购物
解释一下Windows的消息机制
2014/01/30 面试题
求职推荐信范文
2013/12/01 职场文书
汽车运用工程专业毕业生推荐信
2013/12/25 职场文书
《盲人摸象》教学反思
2014/02/16 职场文书
健康状况证明书
2014/11/26 职场文书
2015年社区矫正工作总结
2015/04/21 职场文书
钱学森观后感
2015/06/04 职场文书
2019已经过半,你知道年中工作总结该怎么写吗?
2019/07/03 职场文书
Python控制台输出俄罗斯方块的方法实例
2021/04/17 Python