个人中心
文章发布
退出
作者热门文章
- html - 出于某种原因，IE8 对我的 Sass 文件中继承的 html5 CSS 不友好？
- JMeter 在响应断言中使用 span 标签的问题
- html - 在 :hover and :active? 上具有不同效果的 CSS 动画
- html - 相对于居中的 html 内容固定的 CSS 重复背景？
30
4
我正在使用 webpack 开始我的学习之路，但遇到了一个问题，我认为这是由 extract-loader 引起的。 .当webpack抓取我的HTML文件时，似乎无法正常编译，在使用import.meta时报错.我认为这个错误，而不是真正的错误，表明我对 webpack 及其加载器如何工作的理解存在问题。有人可以看看我的文件，看看他们是否发现了错误吗？
我正在使用节点 v15.12.0 和 npm v7.6.3。
非常感谢。
package.json
{
"devDependencies": {
"css-loader": "^5.2.0",
"extract-loader": "^5.1.0",
"file-loader": "^6.2.0",
"html-loader": "^2.1.2",
"style-loader": "^2.0.0",
"webpack": "^5.28.0",
"webpack-cli": "^4.5.0"
}
}
const path = require('path')
module.exports = {
mode: 'development',
entry: './src/main.js',
output: {
filename: 'bundle.js',
path: path.join(__dirname, 'dist'),
publicPath: '/dist'
},
module: {
rules: [
{
test: /\.css$/,
use: ['style-loader', 'css-loader']
},
{
test: /\.html$/,
use: [
{
loader: 'file-loader',
options: {
name: '[name].html'
}
},
'extract-loader',
'html-loader'
]
}
]
}
}
require('./style.css')
require('./index.html')
body {
margin: 0;
}
<!DOCTYPE html>
<html lang="en">
<body>
<h1>Hello world!</h1>
<script src="main.js"></script>
</body>
</html>
$ npx webpack
asset bundle.js 19.6 KiB [compared for emit] (name: main)
runtime modules 937 bytes 4 modules
cacheable modules 8.95 KiB
modules by path ./src/ 737 bytes
modules by path ./src/*.css 651 bytes
./src/style.css 326 bytes [built] [code generated]
./node_modules/css-loader/dist/cjs.js!./src/style.css 325 bytes [built] [code generated]
./src/main.js 47 bytes [built] [code generated]
./src/index.html 39 bytes [built] [code generated] [1 error]
modules by path ./node_modules/ 8.23 KiB
./node_modules/style-loader/dist/runtime/injectStylesIntoStyleTag.js 6.67 KiB [built] [code generated]
./node_modules/css-loader/dist/runtime/api.js 1.57 KiB [built] [code generated]
ERROR in ./src/index.html
Module build failed (from ./node_modules/extract-loader/lib/extractLoader.js):
SyntaxError: unknown: Unexpected token (3:54)
1 | // Imports
2 | import ___HTML_LOADER_GET_SOURCE_FROM_IMPORT___ from "../node_modules/html-loader/dist/runtime/getUrl.js";
> 3 | var ___HTML_LOADER_IMPORT_0___ = new URL("./main.js", import.meta.url);
| ^
4 | // Module
5 | var ___HTML_LOADER_REPLACEMENT_0___ = ___HTML_LOADER_GET_SOURCE_FROM_IMPORT___(___HTML_LOADER_IMPORT_0___);
6 | var code = "<!DOCTYPE html>\n<html lang=\"en\">\n<body>\n <h1>Hello world!</h1>\n <script src=\"" + ___HTML_LOADER_REPLACEMENT_0___ + "\"></script>\n</body>\n</html>\n\n";
at Parser.pp$5.raise (/home/jdferreira/Repositories/Temps/extract-loader-issue/node_modules/babylon/lib/index.js:4454:13)
最佳答案
这是 extract-loader 中的一个错误与 Webpack 5 一起使用时:
https://github.com/peerigon/extract-loader/issues/111
我遇到了同样的问题，显然直到现在还没有解决方案。如果可以，请尝试使用 webpack 4。
或者你可以看看html-webpack-plugin ，也许它对您的情况有用。
关于Webpack、html-loader、file-loader 和 extract-loader，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/66819903/
30
4
0
我想知道是否可以访问放在 tomcat 的 conf 文件夹中的文件。通常我会在这个文件中放置多个 webapp 的配置，在 war 之外。 我想使用类路径独立于文件系统。 我过去使用过 lib 文件
我有一个 PowerShell 脚本，它获取文件列表并移动满足特定条件的文件。为什么即使对象为空，foreach 循环也会运行？ 我假设如果 $i 不存在，它就不会运行。但是如果 $filePath
我已将 BasicAccountRule.drl 放置在我的 Web 应用程序中，位置为:C:/workspace/exim_design/src/main/resources/rules/drl/i
我使用 File.open('file.txt').class 和 File.open('file.txt').readlines.class 以及前者进行了检查一个返回 File，后者返回 Arra
我正在尝试使用 FileOutputStream 删除文件，在其中写入内容后。这是我用来编写的代码: private void writeContent(File file, String fileC
我正在尝试使用 flink 和 python 批处理 api 测试 Wordcount 经典示例。我的问题是，将数据源从 env.from_elements() 修改为 env.read_text()
我正在尝试制作一个可以同时处理多个不同文件的程序。我的想法是制作一个包含 20 个 FILE* 的数组，以便在我达到此限制时能够关闭其中一个并打开请求的新文件。 为此，我想到了一个函数，它选择一个选项
我有两个文件A和B文件A: 976464 792992 文件B TimeStamp,Record1,976464,8383,ABCD 我想搜索文件 A 和文件 B 中的每条记录并打印匹配的记录。打印的
我有一些保存在 map 中的属性文件。示例: Map map = new HashMap<>(); map.put("1", "One"); map.put("2", "Two"); map.put(
我正在尝试找出一个脚本文件，该文件接受一个包含文件列表的文件(每一行都是一个文件路径，即 path/to/file)并将它们合并到一个文件中。 例如: list.text -- path/to/fil
为了使用 File.CreateText() 和 File.AppendText() 你必须: 通过调用这些方法之一打开流 写消息 关闭流 处理流 为了使用 File.AppendAllText()
使用rsync时，如何在使用--files-from参数复制时重命名文件？我有大约190，000个文件，在从源复制到目标时，每个文件都需要重命名。我计划将文件列表放在一个文本文件中传递给--files
我在非服务器应用程序中使用 Spring(只需从 Eclipse 中某个类的 main() 编译并运行它)。 我的问题是作为 new FileSystemXmlApplicationContext 的
QNX (Neutrino 6.5.0) 使用 ksh 的开源实现作为其 shell 。许多提供的脚本，包括系统启动脚本，都使用诸如 if ! test /dev/slog -ef /dev/slog
当我尝试打开从我的应用程序下载的 xls 文件时，出现此错误: excel cannot open the file because the file format or file extension
有一些相关的概念，即文件指针、流和文件描述符。 我知道文件指针是指向数据类型 FILE 的指针(在例如 FILE.h 和 struct_FILE.h 中声明)。 我知道文件描述符是 int ，例如成员
好吧，这应该很容易... 我是groovy的新手，我希望实现以下逻辑: def testFiles = findAllTestFiles(); 到目前为止，我想出了下面的代码，该代码可以成功打印所有文
我理解为什么以下内容会截断文件的内容: Get-Content | Out-File 这是因为 Out-File 首先运行，它会在 Get-Content 有机会读取文件之前清空文件。 但是当我尝
您好，我正在尝试将文件位置表示为变量，因为最终脚本将在另一台机器上运行。这是我尝试过的代码，然后是我得到的错误。在我看来，python 是如何添加“\”的，这就是导致问题的原因。如果是这种情况，我如何
我有一个只包含一行的输入文件: $ cat input foo bar 我想在我的脚本中使用这一行，据我所知有 3 种方法: line=$(cat input) line=$( input"...,
我是一名优秀的程序员,十分优秀！