webpack 的重要静态文件答案

【问题标题】：important static file to webpackwebpack 的重要静态文件
【发布时间】：2017-06-12 16:39:59
【问题描述】：

我正在 github 中探索一个 react 项目。

我在 app.js 中看不懂这些

import 'file?name=[name].[ext]!../manifest.json';
import 'file?name=[name].[ext]!../.htaccess';
import 'file?name=[name].[ext]!../favicon.ico';
import 'file?name=[name].[ext]!../favicon.png';

从第 11 行开始，https://github.com/mxstbr/login-flow/blob/master/js/app.js

【问题讨论】：

你有没有做任何事情来帮助你理解它？例如。您是否搜索并阅读了一些文档？如果是，还有什么不清楚的地方？如果没有，为什么不呢？
@FelixKling 不知道是es6还是webpack的一部分。我只知道你可以import React from 'react'
绝对是 webpack。 ES6 实际上并没有定义模块标识符的结构。 IE。字符串中的内容完全取决于 module loader（在本例中为 webpack）。你看到的是 webpack 的文件加载器：github.com/webpack-contrib/file-loader

标签： javascript reactjs webpack ecmascript-6

【解决方案1】：

它使用 webpack 的 file-loader。

file-loader 通常会按原样加载文件。然后将其作为 <md5hash>.<extension> 放入 webpack 输出中。如果将name=[name].[ext] 指定为file-loader 的查询字符串参数，则输出文件名将与原始文件名相同。

所以，总而言之，这是一种确保将文件复制到 webpack 输出，但不以任何方式修改它的方法，包括文件名。

【讨论】：