TypeScript 文件引入 Html (ts import html webpack)
我们的目标是把html引入ts文件,webpack打包时就能把html打进js文件,减少文件加载啦
1 安装 text-loader
npm install text-loader --save-dev
2 webpack 配置里新增 text-loader 为文本加载器
module: {
rules: [
{
test: /\.html$/,
use: 'raw-loader',
}
]
新建文件 命名为 typings.d.ts, 这样TypeScript文件里就可把Html引入为字符串模块了
declare module "*.html" {
const content: string;
export default content;
}
4 在 TypeScript 里引入html
import prompt from '../../dom/Prompt.html';(这里写html文件的相对路径)
console.log( prompt ) ;
TypeScript 文件引入 Html (ts import html webpack)的更多相关文章
- CSS文件引入link和@import 区别
1.(本质区别)link 属于 HTML 标签,而 @import 完全是 css 提供的一种导入 css 文件的规则. 2.文件加载时机有差别: 当一个页面被加载的时候,link 引用的 css 会 ...
- vue脚手架使用swiper /引入js文件/引入css文件
1.安装vue-cli 参考地址:https://github.com/vuejs/vue-cli 如果不使用严格语法需要在后三项打no:(加了挺头疼的,老是报错,但是对自己的代码规范性也是有很大的帮 ...
- vue cli搭建项目及文件引入
cli搭建方法:需安装nodejs先 1.npm install -g cnpm --registry=https://registry.npm.taobao.org //安装cnpm,用cnpm下载 ...
- vue引入swiper vue使用swiper vue脚手架使用swiper /引入js文件/引入css文件
vue引入swiper vue使用swiper vue脚手架使用swiper /引入js文件/引入css文件 ------------------------------------------- ...
- route按需加载的3种方式:vue异步组件、es提案的import()、webpack的require.ensure()
1. vue异步组件技术 vue-router配置路由,使用vue的异步组件技术,可以实现按需加载. 但是,这种情况下一个组件生成一个js文件.举例如下: { path: '/promisedemo' ...
- SPRING IN ACTION 第4版笔记-第二章WIRING BEANS-008-在Java配置文件中引入xml配置文件@Import、@ImportResource
1. package soundsystem; import org.springframework.beans.factory.annotation.Autowired; public class ...
- html文件引入其它html文件的几种方法:include方式
可以在一个html的文件当中读取另一个html文件的内容吗?答案是确定的,而且方法不只一种,在以前我只会使用iframe来引用,后来发现了另外的几种方法,那今天就总结这几种方法让大家参考一下. 1.I ...
- flask 安装及基础学习(url_for反转,静态文件引入)
pip3 install flask pycharm 创建项目 默认的代码解释说明(及开启debug模式) #encoding:utf-8 from flask import Flask #从flas ...
- 在vscode上 运行typescript 文件
安装nodejs 安装链接: https://nodejs.org/zh-cn/ 安装测试: node -v npm -v 安装typescript sudo npm install typescri ...
随机推荐
- Myeclipse 安装时候android adt, android sdk常见问题
离线版adt安装 可以随意百度adt下载 安装时候注意断网模式,否则会连接到服务器耗费很长时间:如果安装报错,可能是adt与Myeclipse版本不匹配,如我用的是Myeclipse8.6,安装AD ...
- 修改了ssh默认端口对git的影响
如果服务端的ssh不是采用的默认端口. 那么客户端git命令就会报错: ssh: connect to host 192.168.2.152 port 22: Connection refused 这 ...
- Python测试进阶——(1)安装Python测试相关模块
安装python 安装pip yum -y install epel-release yum -y install python-pip 安装psutil 参考:https://www.cnblogs ...
- NMEA-0183
GPGSA( 当前卫星信息) 例:$GPGSA,A,3,01,20,19,13,,,,,,,,,40.4,24.4,32.2*0A 字段0:$GPGSA,语句ID,表明该语句为GPS DO ...
- Oracle删除重复数据并且只留其中一条数据
数据库操作中,经常会因为导数据造成数据重复,需要进行数据清理,去掉冗余的数据,只保留正确的数据 一:重复数据根据单个字段进行判断 1.首先,查询表中多余的数据,由关键字段(name)来查询. sele ...
- vue 中使用 echarts 自适应问题
echarts 自带的自适应方法 resize() 具体用法: let xxEcharts = this.$echarts.init(document.getElementById('xxx')) ...
- BSGS&ExBSGS
BSGS&ExBSGS 求解形如 \[a^x\equiv b\pmod p\] 的高次同余方程 BSGS 假装\(gcd(a,p)=1\). 设\(m=\lceil\sqrt p \rceil ...
- 007.CI4框架CodeIgniter, 加载自己的helper辅助类,调用自己helper中定义各种全局函数
01. 我们在Helpers文件中创建一个Tx_helper.php的文件,里面就下一个函数 <?php //输出 function ShowMessage($AMsg) { echo &quo ...
- 配置thinkphp对mysql线上线下切换不同环境的配置 - (mysql-thinkphp) (1)
1.先打印出配置项的信息,在Index控制器下面的index->index里面设置 namespace app\index\controller; class Index { public fu ...
- LeetCode1046 最后一块石头的重量(贪心—Java优先队列简单应用)
题目: 有一堆石头,每块石头的重量都是正整数. 每一回合,从中选出两块最重的石头,然后将它们一起粉碎.假设石头的重量分别为 x 和 y,且 x <= y.那么粉碎的可能结果如下: 如果 x == ...