我是nodejs新手,在尝试使用sass时遇到了问题。
以下信息只是虚构的,但它表示
实际情况。
场景:
我有以下文件夹结构:
frontend/
- scss/
- style.scss
- main.js
webpack.config.js
目标
:
我想编译
style.scss
到
style.css
使用网页包并将其放入
dist/frontend/css/
目录,因此应该生成以下路径:
dist/frontend/css/style.css
并创建以下文件夹结构:
dist/
- frontend/
- scss/
- style.scs
- main.js
frontend/
- scss/
- style.scss
- main.js
webpack.config.js
代码:
MIN JS
import `style from "./scss/style.scss";`
webpack.config.js文件
module.exports = {
mode: "development",
entry: {
main: "./frontend/main.js"
},
output: {
path: path.join(__dirname, "/dist/frontend"),
publicPath: "/",
filename: "[name].js"
},
module: {
rules: [
{
test: /\.(s*)css$/,
use: [
{
loader: "file-loader",
options: {
name: "css/[name].[ext]"
}
},
"style-loader/url",
"css-loader?-url",
"sass-loader"
]
}
]
}
结果:
我收到这个消息:
Module not found: Error: Can't resolve './scss/style.scss' in 'E:\project_name\frontend'
问题
-
为什么会这样?
-
正确的代码是什么?
目标
?