- 89
- 0
最近在学习antd,使用create-react-app这个脚手架,根据网上配置了less,但是start之后ant报错.
webpack.configi.dev配置代码
{
test: /\.(css|less)$/,
use: [
require.resolve('style-loader'),
{
loader: require.resolve('css-loader'),
options: {
importLoaders: 1,
},
},
{
loader: require.resolve('postcss-loader'),
options: {
// Necessary for external CSS imports to work
// https://github.com/facebookincubator/create-react-app/issues/2677
ident: 'postcss',
plugins: () => [
require('postcss-flexbugs-fixes'),
autoprefixer({
browsers: [
'>1%',
'last 4 versions',
'Firefox ESR',
'not ie < 9', // React doesn't support IE8 anyway
],
flexbox: 'no-2009',
}),
],
},
},
{
loader: require.resolve('less-loader') // compiles Less to CSS
}
],
},
错误信息
./node_modules/antd/dist/antd.css
Module build failed:
/* autoprefixer: off */
filter: progid\:DXImageTransform\.Microsoft\.Blur(PixelRadius\=1, MakeShadow\=false);
Unrecognised input
in /Users/heliu/Desktop/ant-echarts/node_modules/antd/dist/antd.css (line 15367, column 16)
- 共 0 条
- 全部回答
-
°吃貨一枚≥0≤ 普通会员 1楼
在
create-react-app项目中配置less后,如果出现antd报错,可能是以下几种情况:- 安装antd错误:在
create-react-app项目中,首先需要安装antd库,可以通过npm或yarn进行安装。如果安装失败,可以尝试以下步骤:
a. 在命令行中输入以下命令,安装
antd:npm install --saveantd或者yarn add --saveantdb. 确保在
src目录下,添加以下配置文件:javascript .antd/dist/index.cssc. 重启项目并重新运行
create-react-app命令,确认antd库已经正确安装并添加到项目中。antd版本冲突:antd库可能与项目中已经使用的其他库或组件版本冲突。例如,如果你在项目中已经使用了react、react-dom等库,那么在配置antd时可能需要确保这些库的版本与antd相同。例如: ```javascript import React from 'react'; import ReactDOM from 'react-dom'; import App from './App'; import './App.css';
ReactDOM.render(
, document.getElementById('root')); ``` 如果你使用了
antd自带的样式表,确保antd.css文件在项目中位于antd/dist目录下。然后在App.css文件中添加以下内容:css @import './antd.css';-
antd依赖问题:在项目中使用antd库时,可能需要确保你的项目中有相应的依赖项。例如,如果你在App.css文件中引入了antd的某个组件,但不在antd.css文件中定义组件样式,那么antd组件可能无法正常工作。你需要确保在App.css文件中包含对antd组件的引用,例如:css .ant-cell { font-size: 1rem; } -
antd组件配置问题:antd组件可能需要进行特定的配置才能正常工作。例如,如果antd组件使用了动态路由,你需要在App.js文件中配置路由,并确保antd组件可以正确接收路由参数。例如: ```javascript import React from 'react'; import ReactDOM from 'react-dom'; import App from './App'; import './App.css';
class App extends React.Component { render() { const { component, routes } = this.props;
if (routes) { return ( <div> <Router> <Route exact path="/" component={component} /> {routes.map((route, index) => ( <Route key={index} path={route.path} component={route.component} /> ))} </Router> </div> ); } return <div>Loading...</div>; }}
ReactDOM.render(
, document.getElementById('root')); ``` 如果以上步骤都无法解决问题,可能需要检查
antd组件的官方文档,了解其文档中的配置说明或错误信息,以便定位问题原因并进行相应修改。同时,你也可以尝试将antd库的antd.css文件和相应的组件引入到项目中,如果样式冲突依然存在,可能需要重新安装或更新antd库。 - 安装antd错误:在
- 扫一扫访问手机版
回答动态

- 神奇的四哥:发布了悬赏问题阿里云幻兽帕鲁服务器更新之后。服务器里面有部分玩家要重新创建角色是怎么回事啊?预计能赚取 0积分收益

- 神奇的四哥:发布了悬赏问题函数计算不同地域的是不能用内网吧?预计能赚取 0积分收益

- 神奇的四哥:发布了悬赏问题ARMS可以创建多个应用嘛?预计能赚取 0积分收益

- 神奇的四哥:发布了悬赏问题在ARMS如何申请加入公测呀?预计能赚取 0积分收益

- 神奇的四哥:发布了悬赏问题前端小程序接入这个arms具体是如何接入监控的,这个init方法在哪里进行添加?预计能赚取 0积分收益

- 神奇的四哥:发布了悬赏问题阿里云幻兽帕鲁服务器刚到期,是不是就不能再导出存档了呢?预计能赚取 0积分收益

- 神奇的四哥:发布了悬赏问题阿里云幻兽帕鲁服务器的游戏版本不兼容 尝试更新怎么解决?预计能赚取 0积分收益

- 神奇的四哥:发布了悬赏问题阿里云幻兽帕鲁服务器服务器升级以后 就链接不上了,怎么办?预计能赚取 0积分收益

- 神奇的四哥:发布了悬赏问题阿里云幻兽帕鲁服务器转移以后服务器进不去了,怎么解决?预计能赚取 0积分收益

- 神奇的四哥:发布了悬赏问题阿里云幻兽帕鲁服务器修改参数后游戏进入不了,是什么情况?预计能赚取 0积分收益
- 回到顶部
- 回到顶部

