我一直在关注各种关于将 semantic-ui-less 导入 webpack 项目的教程。 但是,每当我完成不同的教程时,我都会遇到同样的错误:
Module build failed:
module.exports = __webpack_public_path__ + "static/media/reset.b0bc6c14.less";
^
Unrecognised input
in /Users/benflowers/Projects/candidate/candidate-ui-cra/node_modules/semantic-ui-less/definitions/globals/reset.less (line 1, column 15)
这是我的 webpack 配置的问题吗 - 我有一个弹出的 create-react-app
webpack 配置和一些额外的加载器:
{
test: /\.less$/,
use: ExtractTextPlugin.extract({
fallback: 'style-loader',
use: [
{ loader: 'css-loader' },
{ loader: 'less-loader' }
]
}),
exclude: [/[\/\\]node_modules[\/\\]semantic-ui-less[\/\\]/]
},
// for semantic-ui-less files:
{
test: /\.less$/,
use: ExtractTextPlugin.extract({
fallback: 'style-loader',
use: [
{ loader: 'css-loader' },
{
loader: 'semantic-ui-less-module-loader',
// you can also add specific options:
options: { siteFolder: path.join(__dirname, 'src/site') }
}
]
}),
include: [/[\/\\]node_modules[\/\\]semantic-ui-less[\/\\]/]
},
// loader for static assets
{
test: /\.(png|jpg|jpeg|gif|svg)$/,
use: {
loader: 'url-loader',
options: {
limit: 10240,
absolute: true,
name: 'images/[path][name]-[hash:7].[ext]'
}
},
include: [path.join(__dirname, 'src'), /[\/\\]node_modules[\/\\]semantic-ui-less[\/\\]/]
}
根据 https://github.com/gadyonysh/semantic-ui-less-module-loader
最佳答案
我遇到了类似的问题。 我刚刚添加到 webpack 配置中
别名
resolve: {
...
alias : {
'../../theme.config$': path.join( __dirname, '../src/assets/theme/theme.config' )
}
},
更少加载器
{
test: /\.less$/,
use : ExtractTextPlugin.extract( {
fallback: [ {
loader: 'style-loader',
} ],
use : [ 'css-loader', 'resolve-url-loader', 'less-loader', 'postcss-loader' ]
} )
},
并排除
{
exclude: [
/\.(config|overrides|variables)$/,
/\.html$/,
/\.(js|jsx)$/,
/\.css$/,
/\.json$/,
/\.bmp$/,
/\.gif$/,
/\.jpe?g$/,
/\.png$/,
/\.scss$/,
],
loader: require.resolve( 'file-loader' ),
options: {
name: 'static/media/[name].[hash:8].[ext]',
},
},
请注意线 /.(配置|覆盖|变量)$/,
关于node.js - Webpack semantic-ui-less 模块构建失败,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/48431157/