Question

有没有办法让Webpack扫描require("file.js")和require("file.css")的Javascript文件，并分别将<script type="text/javascript">和<link rel="stylesheet">插入包含根Javascript的任何HTML文件文件？

例如。给出：

main.html中

<html>
    <head>
        <script type="text/javascript" src="main.js"></script>
[...]

Main.js

require("./login.js");
require("./login.css");

我希望得到这个输出：

main.html中

<html>
    <head>
        <link rel="stylesheet" type="text/css" href="login.css"/>
        <script type="text/javascript" src="login.js"></script>
        <script type="text/javascript" src="main.js"></script>
[...]

奖励积分：能够require("login.scss")并以<link rel="stylesheet" type="text/css" href="login.css"/>结束（意思是考虑到SCSS文件将转换为CSS的事实）。

Answer 1

根据Webpack的作者，此功能尚不存在。

我已提交此功能请求：https://github.com/webpack/webpack/issues/754

Answer 2

我创建了一个小python脚本，允许我从目录导入文件（.js，.css，.younameit）到html。

之前：

<html>
    <head>
    <!-- {SVN_AUTO_IMPORT type:.js; dir:../tsc_out; exclude:; template:<script src="%PATH"</script>;} -->
    </head>

后：

<html>
   <head>
     <script src="../tsc_out/script1.js"></script>
    <script src="../tsc_out/script2.js"></script>
    <script src="../tsc_out/script3.js"></script>
    <script src="../tsc_out/script4.js"></script>
    <script src="../tsc_out/script5.js"></script>
  </head>

https://github.com/seven-jerry/html-importer

如何自动将JS / CSS添加到HTML文件？

main.html中

Main.js

main.html中

2 个答案: