webpack - Webpack sass-loader 入口/输出文件夹的
问题描述
这是我的文件夹结构:
webpack.config.js
- sass
-- _partials.scss
-- style-1.scss
-- style-2.scss
我希望 webpack 自动检测到我的 sass 文件夹中的文件并创建具有相同名称的 css 文件,请注意有一些 sass 部分文件:
webpack.config.js
- sass
-- _partials.scss
-- style-1.scss
-- style-2.scss
- css
-- style-1.css
-- style-2.css
我想用 html 链接的标签加载特定的 css 文件。根据我的 webpack 配置文件,我不知道将 sass 条目和 css 输出文件夹放在哪里:
module.exports = {
context: __dirname + '/js/react/entry',
entry: {
page1: './page1.js',
page2: './page2.js',
},
output: {
filename: '[name].js',
path: __dirname + '/js/react/build'
},
module: {
rules: [
{
test: /.jsx?$/,
loader: 'babel-loader',
exclude: /node_modules/,
query: {
presets: ['env', 'react']
}
},
{
test: /\.scss$/,
use: [
"sass-loader"
]
}
]
}
};
感谢您的帮助!
解决方案
不,我真的想让独立的 css 文件加载到其他页面中链接的 html 标签中。
根据 sass-loader 的文档,sass-loader 是基于 node-sass 的。我想要我的 webpack 中最简单的 node-sass 命令的结果:
node-sass sass -o css
推荐阅读
- javascript - 在 node.js 中处理来自 api 调用的数据
- ruby-on-rails - 多选返回一个数组,但不是嵌套哈希
- html - 动态情况下的元素定位修复
- python - TypeError:提取键时字符串索引必须是整数
- java - 如何在 Android 上的电子邮件中发送附件
- json - 设置 Stripe 支付网关时返回 json 数据时出错。Uncaught (in promise) SyntaxError: Unexpected token < in JSON at position 0
- rest - RestClient.post 响应生成“错误 groovyx.net.http.ResponseParseException:OK”
- c# - 如何将模型中的数据作为数据传递给
- javascript - 单击侧面或退出按钮时下拉菜单必须消失
- php - "message": "方法 Illuminate\\Auth\\SessionGuard::factory 不存在。",