0

我尝试使用@import不工作。</p> 

  // a.less
  .hello{width:100px;height:100px;background:blue;}

  // index.less
  @import './a.less'

  // App.jsx
  import './index.less';
  <div styleName="hello"></div>

错误：

ERROR in ./src/App.jsx
Module build failed: Error: D:/workspace_js/react-redux-boilerplate/src/App.jsx: Could not resolve the styleName 'hello'.
    at styleNameValue.split.filter.map.styleName (D:\workspace_js\react-redux-boilerplate\node_modules\babel-plugin-react-css-modules\dist\getClassNam
e.js:83:15)
    at Array.map (<anonymous>)
    at exports.default (D:\workspace_js\react-redux-boilerplate\node_modules\babel-plugin-react-css-modules\dist\getClassName.js:66:6)
    at exports.default (D:\workspace_js\react-redux-boilerplate\node_modules\babel-plugin-react-css-modules\dist\resolveStringLiteral.js:27:56)
    at PluginPass.JSXElement (D:\workspace_js\react-redux-boilerplate\node_modules\babel-plugin-react-css-modules\dist\index.js:183:46)
    at newFn (D:\workspace_js\react-redux-boilerplate\node_modules\babel-traverse\lib\visitors.js:276:21)
    at NodePath._call (D:\workspace_js\react-redux-boilerplate\node_modules\babel-traverse\lib\path\context.js:76:18)
    at NodePath.call (D:\workspace_js\react-redux-boilerplate\node_modules\babel-traverse\lib\path\context.js:48:17)
    at NodePath.visit (D:\workspace_js\react-redux-boilerplate\node_modules\babel-traverse\lib\path\context.js:105:12)
    at TraversalContext.visitQueue (D:\workspace_js\react-redux-boilerplate\node_modules\babel-traverse\lib\context.js:150:16)
    at TraversalContext.visitMultiple (D:\workspace_js\react-redux-boilerplate\node_modules\babel-traverse\lib\context.js:103:17)
    at TraversalContext.visit (D:\workspace_js\react-redux-boilerplate\node_modules\babel-traverse\lib\context.js:190:19)
    at Function.traverse.node (D:\workspace_js\react-redux-boilerplate\node_modules\babel-traverse\lib\index.js:114:17)
    at NodePath.visit (D:\workspace_js\react-redux-boilerplate\node_modules\babel-traverse\lib\path\context.js:115:19)
    at TraversalContext.visitQueue (D:\workspace_js\react-redux-boilerplate\node_modules\babel-traverse\lib\context.js:150:16)
    at TraversalContext.visitSingle (D:\workspace_js\react-redux-boilerplate\node_modules\babel-traverse\lib\context.js:108:19)
 @ ./src/index.jsx 14:0-24 28:2-30:4 28:29-30:3
 @ multi webpack-hot-middleware/client?reload=true react-hot-loader/patch webpack/hot/only-dev-server ./src/index.jsx

这是测试演示：git@github.com:ganxunzou/react-redux-boilerplate.git

测试设置：

  • clone git@github.com:ganxunzou/react-redux-boilerplate.git
  • git checkout css-module-less-postcss
  • npm i
  • npm run dev
4

1 回答 1

0

尝试使用@import 不起作用。</p>

提到的错误可能是由不同的因素引起的。首先，providedwebpack.config不包含任何.lesscss 文件的加载器，因此请确保在配置中添加适当的加载器：https
://github.com/webpack-contrib/less-loader 其次，样式可以包装在独立的命名空间中，这很有用避免组件之间的冲突 - 所以确保生成的范围是使用的属性

于 2017-12-05T09:56:34.217 回答