Я пытаюсь настроить проект с использованием машинописного текста и веб-пакета, однако я не могу связать HTML-файлы во время процесса сборки.
Я ожидаю index.ts, чтобы импортировать все .htmlфайлы в виде строк (он может нормально импортировать .ts файлов), после чего веб-пакет объединит их, используя file-loader, и поместит их в dist/examples (поэтому, если бы у меня было больше файлов .html, я бы импортировал их здесь иони тоже оказались бы в dist/examples).
Я пробовал относительные и абсолютные имена для импорта, но я получаю ошибку TS2307: Cannot find module './file.html' при запуске как с веб-пакетом, так и когда я пытаюсь это сделатьвручную с tsc -p src/tsconfig.json.
Я довольно новичок в машинописи, и я впервые работаю с файлами .d.ts, но, насколько я понимаю, файл index.d.ts должен сказать машинописи, что нужно разрешить все.html файлы в виде строк.
webpack.config.js
const path = require('path');
module.exports = {
mode: 'development',
entry: {
main: path.resolve(__dirname, 'src', 'main', 'index.ts'),
html: path.resolve(__dirname, 'src', 'res', 'html', 'index.ts')
},
module: {
rules: [
{
test: /\.ts$/,
use: 'ts-loader',
exclude: /node_modules/,
options: {
configFile: 'src/tsconfig.json',
}
},
{
test: /\.html$/,
loader: 'file-loader',
include: path.resolve(__dirname, 'src', 'res', 'html'),
exclude: /node_modules/,
options: {
name: '[name].[ext]',
outputPath: 'examples',
}
}
]
},
resolve: {
extensions: [ '.ts', '.html', '.js' ]
},
output: {
filename: '[name].js',
path: path.resolve(__dirname, 'dist')
}
};
src / tsconfig.json
{
"compilerOptions": {
"outDir": "../dist/",
"noImplicitAny": true,
"module": "commonjs",
"target": "es5",
"allowJs": false,
"moduleResolution": "node",
"lib": ["es6", "dom"],
"typeRoots": [ "../node_modules/@types", "../types"],
},
"include": [
"main/**/*",
"res/html/**/*"
],
"exclude": []
}
types / index.d.ts
declare module '*.html' {
const value: string;
export default value
}
src / res / html / index.ts
import test from './test'
import file from './file.html'
src / res / html / file.html
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title>FILE</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
</head>
<body>
<h1>hello world</h1>
</body>
</html>