СС
Он очень прост
Size: a a a
2016 November 12
СС
Один раз сесть - понять и проблем нет
ТС
плохо документирован он
ТС
сегодня решил наконец понять все что я копипастил
ТС
и зафигачил такую крутотень у себя
ТС
<!DOCTYPE html>
<html lang="en">
<head>
<base href="/">
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, minimal-ui" />
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<!-- for ios 7 style, multi-resolution icon of 152x152 -->
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-status-barstyle" content="black-translucent">
<meta name="apple-mobile-web-app-title" content="Flatkit">
<!-- for Chrome on Android, multi-resolution icon of 196x196 -->
<meta name="mobile-web-app-capable" content="yes">
<link rel="apple-touch-icon" sizes="180x180" href="theme/assets/images/icons/apple-touch-icon.png">
<link rel="icon" type="image/png" href="theme/assets/images/icons/favicon-32x32.png" sizes="32x32">
<link rel="icon" type="image/png" href="theme/assets/images/icons/favicon-16x16.png" sizes="16x16">
<link rel="manifest" href="theme/assets/images/icons/manifest.json">
<link rel="mask-icon" href="theme/assets/images/icons/safari-pinned-tab.svg" color="#5bbad5">
<link rel="shortcut icon" href="theme/assets/images/icons/favicon.ico">
<meta name="msapplication-config" content="theme/assets/images/icons/browserconfig.xml">
<meta name="theme-color" content="#ffffff">
…
<html lang="en">
<head>
<base href="/">
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, minimal-ui" />
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<!-- for ios 7 style, multi-resolution icon of 152x152 -->
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-status-barstyle" content="black-translucent">
<meta name="apple-mobile-web-app-title" content="Flatkit">
<!-- for Chrome on Android, multi-resolution icon of 196x196 -->
<meta name="mobile-web-app-capable" content="yes">
<link rel="apple-touch-icon" sizes="180x180" href="theme/assets/images/icons/apple-touch-icon.png">
<link rel="icon" type="image/png" href="theme/assets/images/icons/favicon-32x32.png" sizes="32x32">
<link rel="icon" type="image/png" href="theme/assets/images/icons/favicon-16x16.png" sizes="16x16">
<link rel="manifest" href="theme/assets/images/icons/manifest.json">
<link rel="mask-icon" href="theme/assets/images/icons/safari-pinned-tab.svg" color="#5bbad5">
<link rel="shortcut icon" href="theme/assets/images/icons/favicon.ico">
<meta name="msapplication-config" content="theme/assets/images/icons/browserconfig.xml">
<meta name="theme-color" content="#ffffff">
…
ТС
видите мусор в виде <link..>?
ТС
в папке theme лежит много лишних файлов
ТС
как сделать так, чтобы в dist попало только то что реально используется в проекте?
ТС
а если не только в HEAD? в ангулярских шаблонах тоже много чего подгружается
ТУ
что например ?
ТС
рисунки всякие
ТУ
рисунки ? 😐
ТС
на вебпаке решил так:
<link rel="apple-touch-icon" sizes="180x180" href="${require('../theme/assets/images/icons/apple-touch-icon.png')}">
<link rel="icon" type="image/png" href="${require('../theme/assets/images/icons/favicon-32x32.png')}" sizes="32x32">
<link rel="icon" type="image/png" href="${require('../theme/assets/images/icons/favicon-16x16.png')}" sizes="16x16">
<link rel="manifest" href="${require('!!file?name=static/[name].[hash].[ext]!../theme/assets/images/icons/manifest.json')}">
<link rel="mask-icon" href="${require('../theme/assets/images/icons/safari-pinned-tab.svg')}" color="#5bbad5">
<link rel="shortcut icon" href="${require('../theme/assets/images/icons/favicon.ico')}">
<meta name="msapplication-config" content="${require('!!file?name=static/[name].[hash].[ext]!../theme/assets/images/icons/browserconfig.xml')}">
<link rel="apple-touch-icon" sizes="180x180" href="${require('../theme/assets/images/icons/apple-touch-icon.png')}">
<link rel="icon" type="image/png" href="${require('../theme/assets/images/icons/favicon-32x32.png')}" sizes="32x32">
<link rel="icon" type="image/png" href="${require('../theme/assets/images/icons/favicon-16x16.png')}" sizes="16x16">
<link rel="manifest" href="${require('!!file?name=static/[name].[hash].[ext]!../theme/assets/images/icons/manifest.json')}">
<link rel="mask-icon" href="${require('../theme/assets/images/icons/safari-pinned-tab.svg')}" color="#5bbad5">
<link rel="shortcut icon" href="${require('../theme/assets/images/icons/favicon.ico')}">
<meta name="msapplication-config" content="${require('!!file?name=static/[name].[hash].[ext]!../theme/assets/images/icons/browserconfig.xml')}">
ТС
loaders: [
…
{
test: /\.html$/,
loader: 'html?interpolate'
},
…
{
test: /\.html$/,
loader: 'html?interpolate'
},
ТУ
а зачем оно надо ?
ТС
чтобы в папку dist не копировать весь мусор из theme/
ТУ
html?interpolate
такой очевидный вебпак))
такой очевидный вебпак))