Webpack 不会捆绑我的 .css 文件

Question

这是我的文件；

webpack.config.dev.js：

import path from "path";

export default {
	//entry point of our application
	entry: "./src/index",

	//Generates a sourcemap
	devtool: "inline-source-map",
	/*debug: true,*/  //This property was removed in Webpack 2

	devServer: {
		//Setting to false will display a list of all files that are being bundled
		noInfo:false
	},

	//Used to targert an environment, set to web in this app so that it can run in browser
	target: "web",

	//Specifies where to create the webpack bundle
    //With this configuration, webpack will not generate any physical file
    //It will create the bundle in memory and serve it to the browser
    //Need to define the path and name to simulate the files existence
	output: {
		path: path.resolve(__dirname, "/src"),
		publicPath: "/",
		filename: "bundle.js"
	},

	//Enables webpack to process more than just JavaScript files
	module:{
		//In regards to migrating from webpack 1 to webpack 2
		//'module.loaders' is now 'module.rules'
		//'rules' tell webpack how to handle each file specified below
		rules: [
			{test: /\.js$/, exclude: /node_modules/, loader: "babel-loader"},
			{test: /\.css$/, use: [	"style-loader", "css-loader"
				/*{loader: "style-loader"},
				{loader: "css-loader", options: {modules: true}}*/
			]}
		]
	}
}

style.css：

body {
	font-family: sans-serif;
}

table th{
	padding: 5px;
}

index.js：

import "style.css";

我用来运行 webpack 的 npm 脚本：

"start": "npm-run-all --parallel security-check dev-webserv lint:watch",

我已经正确安装了每个 npm 包作为开发依赖项，但是当我运行启动脚本时，我得到了以下内容：

./src/index.js 中的错误 找不到模块：错误：无法解析“style.css” 'C:\Users\X\Projects\Node.js\JavaScript-dev-env\src'

@ ./src/index.js 3:0-20 i ｢wdm｣: 编译失败。

我之前可以通过卸载每个依赖项并重新安装它们来解决此问题，但遗憾的是这次无法正常工作。请帮忙。我在这里和其他网站上浏览了这么多论坛，但没有任何帮助。

**编辑：

import style from "style.css";
style.use();
style.unuse();

修改 index.js 以尝试用户 'Neha Tawar' 的建议，结果是

(+) 未发现已知漏洞 i ｢wdm｣：等到捆绑完成：/ × ｢wdm｣：哈希：2b6ab568fd0c4866fe49 版本：webpack 3.11.0 时间：435ms
资产大小块块名称 bundle.js 94.9 kB 0 [emitted] main [0] ./src/index.js 715 bytes {0} [built]
[1] ./node_modules/numeral/numeral.js 33.6 KB {0} [建成]

./src/index.js 中的错误未找到模块：错误：无法解析 'C:\Users\X\Projects\Node.js\JavaScript-dev-env\src' 中的'style.css' @ ./src/index.js 3:13-33 i ｢wdm｣：编译失败。

问题仍然存在，对此问题的任何更多输入都会有所帮助，谢谢

编辑：终于弄明白了 原因是由于声明：import 'style.css'; 应该是 import './style.css';

谢谢你的帮助

Answer 1

请检查天气 d.ts 是否已创建 css 文件。我认为 typescript 无法加载 css 文件或无法找到相同的声明请尝试这些 webpack.config.js 更改添加 style-loader in plugins 可能会有所帮助，您的相关问题将解决。

也请检查链接 article for css typings creation and use

----编辑----- 您已经在使用插件意味着您确实添加了样式加载器。我认为样式不是在 import/require() 上添加的，而是在调用 use/ref 时添加的。如果 unuse/unref 的调用频率与 use/ref 的调用频率完全相同，则样式将从页面中删除。

import style from './file.css'

style.use(); // = style.ref();
style.unuse(); // = style.unref();

查看解释链接style-loader