HTML作为Webpack入口点

问题描述 投票:0回答:2

首先,我对Web开发完全陌生,所以如果我的方法完全错误,那就这么说吧。

我想自动构建sass和ts文件,所以我读到了Gulp / Webpack,看起来像webpack是要走的路。

我正在构建一个简单的单页网站,现在我只需要一个小的javascript,所以在我看来,webpack的入口点应该是html文件本身。但是,所有的文档和教程只讨论从.js开始。

有没有办法从HTML开始并解决js,css,图像和其他必需的东西?

我应该只使用webpack废弃并使用gulp来编译打字稿和sass吗?

webpack gulp
2个回答
0
投票

严格来说,你不能按照你的要求完成整个申请

[使用] HTML作为Webpack入口点

HTML文件无法引用硬盘中的本地文件(有模板系统,但这是另一回事)。 HTML文件由服务器提供,只能引用远程文件。

使用Webpack,您将使用不同的loaders,它们能够根据文件类型对文件执行不同的操作。

你能做的是:

  • 如果您使用的是模板库或HTML导入,请将HTML用作其他HTML文件的Webpack入口点
  • 使用JS文件作为所有JS文件的Webpack入口点(通常是index.js)
  • 然后将两个输出放在dist文件夹中,HTML输出将引用您的JS输出,但不会引用相对或绝对路径(磁盘),它将使用远程资源定位器执行此操作。这些标准是统一资源定位器,一个URL(相对URL)。请原谅过于详细(迂腐)的描述,我只想尽可能清楚地解释这一切背后的原因。

但是,所有的文档和教程只讨论从.js开始。

对于一个简单的网站,如单个网站,通常HTML根本不会进行任何预处理。并且,在构建步骤中采取的唯一操作是将文件从src移动到dist,这就是教程倾向于关注JS方面的原因。

从您的项目描述来看,它似乎是一个开始尝试的好地方是html-loader它支持缩小,解析图像路径等常用功能。


0
投票

一种替代方法是使用Parcel,它支持将HTML文件作为条目。

© www.soinside.com 2019 - 2024. All rights reserved.