英文:
Installing icon library for react version 15.6.0
问题
我有一个使用React版本15.6.0的旧项目,我想安装一个新的库来使用图标。
我尝试了FontAwesomeIcons库,但似乎与这个React版本不兼容。
这是项目的package.json文件:
"dependencies": {
"airbnb-js-shims": "^1.3.0",
"axios": "^0.16.2",
"babel-plugin-macros": "^3.1.0",
"bootstrap": "^3.3.7",
"classnames": "^2.2.5",
"dns": "file:./src/dns",
"glamor": "^2.20.40",
"js-cookie": "2.1.4",
"moment": "^2.18.1",
"moment-timezone": "^0.5.13",
"react": "^15.6.0",
"react-bootstrap": "^0.31.0",
"react-bootstrap-autosuggest": "^0.5.0",
"react-bootstrap-switch": "^15.5.0-a",
"react-bootstrap-typeahead": "^2.0.0-alpha.3",
"react-click-outside": "^2.3.1",
"react-datetime": "^2.9.0",
"react-dom": "^15.6.0",
"react-loading-spinner": "^1.0.12",
"react-redux": "^5.0.5",
"react-redux-multilingual": "^1.0.4",
"react-router-dom": "^4.1.1",
"react-scripts": "1.0.13",
"react-select": "^1.0.0-rc.10",
"react-sortable": "^1.2.0",
"react-sortable-component": "^1.0.0",
"react-sortable-hoc": "^0.6.8",
"react-toastify": "^4.1.0",
"redux": "^3.6.0",
"redux-thunk": "^2.2.0",
"smoothscroll-polyfill": "^0.4.0"
},
"devDependencies": {
"babel-eslint": "^8.0.2",
"babel-plugin-import": "^1.6.2",
"babel-plugin-transform-imports": "^1.4.1",
"eslint": "^3.19.0",
"eslint-config-google": "^0.8.0",
"eslint-plugin-babel": "^4.1.1",
"eslint-plugin-react": "^7.0.1",
"react-app-rewired": "^1.3.5",
"react-scripts": "1.0.7"
},
"scripts": {
"start": "react-app-rewired start",
"build": "react-app-rewired build && mv build ./webagent && mkdir ./build && mv ./webagent ./build/webagent",
"build:pre_prod": "react-app-rewired build",
"build:prod": "react-app-rewired build",
"test": "react-scripts test --env=jsdom",
"eject": "react-scripts eject"
}
尝试安装较旧版本和其他库,但也无法工作。
英文:
I have an old project that uses react version 15.6.0, and I want to install a new library to use icons.
I tried FontAwesomeIcons library but it seems to not be compatible with this react version.
Here is the package.jason of the project:
"dependencies": {
"airbnb-js-shims": "^1.3.0",
"axios": "^0.16.2",
"babel-plugin-macros": "^3.1.0",
"bootstrap": "^3.3.7",
"classnames": "^2.2.5",
"dns": "file:./src/dns",
"glamor": "^2.20.40",
"js-cookie": "2.1.4",
"moment": "^2.18.1",
"moment-timezone": "^0.5.13",
"react": "^15.6.0",
"react-bootstrap": "^0.31.0",
"react-bootstrap-autosuggest": "^0.5.0",
"react-bootstrap-switch": "^15.5.0-a",
"react-bootstrap-typeahead": "^2.0.0-alpha.3",
"react-click-outside": "^2.3.1",
"react-datetime": "^2.9.0",
"react-dom": "^15.6.0",
"react-loading-spinner": "^1.0.12",
"react-redux": "^5.0.5",
"react-redux-multilingual": "^1.0.4",
"react-router-dom": "^4.1.1",
"react-scripts": "1.0.13",
"react-select": "^1.0.0-rc.10",
"react-sortable": "^1.2.0",
"react-sortable-component": "^1.0.0",
"react-sortable-hoc": "^0.6.8",
"react-toastify": "^4.1.0",
"redux": "^3.6.0",
"redux-thunk": "^2.2.0",
"smoothscroll-polyfill": "^0.4.0"
},
"devDependencies": {
"babel-eslint": "^8.0.2",
"babel-plugin-import": "^1.6.2",
"babel-plugin-transform-imports": "^1.4.1",
"eslint": "^3.19.0",
"eslint-config-google": "^0.8.0",
"eslint-plugin-babel": "^4.1.1",
"eslint-plugin-react": "^7.0.1",
"react-app-rewired": "^1.3.5",
"react-scripts": "1.0.7"
},
"scripts": {
"start": "react-app-rewired start",
"build": "react-app-rewired build && mv build ./webagent && mkdir ./build && mv ./webagent ./build/webagent",
"build:pre_prod": "react-app-rewired build",
"build:prod": "react-app-rewired build",
"test": "react-scripts test --env=jsdom",
"eject": "react-scripts eject"
}
}
Tried installing older versions and other libraries but woudn't work either
答案1
得分: 0
React版本15.6.0相当老,发布于2017年6月8日。大多数现代图标库都是针对更新版本的React构建的,可能与这么老的React版本不兼容。
然而,仍然有一些图标库可能与React 15.6.0兼容。其中一个库是"react-icons"库。根据他们的文档,它支持React 0.14.x及更高版本,应该包括React 15.6.0。
你可以使用npm或yarn安装"react-icons"库,然后在你的React应用程序中像这样使用它:
import { FaStar } from 'react-icons/fa';
function MyComponent() {
return (
<div>
<FaStar />
<p>Star图标</p>
</div>
);
}
请注意,由于React 15.6.0是一个非常老的版本,你可能会在其他库和组件上遇到兼容性问题,所以如果可能的话,考虑升级到更新版本的React可能是值得的。
英文:
React version 15.6.0 is quite old and was released on June 8, 2017. Most current icon libraries are built with newer versions of React in mind and may not be compatible with such an old version of React.
However, there are still some icon libraries that may be compatible with React 15.6.0. One such library is the "react-icons" library. According to their documentation, it supports React 0.14.x and above, which should include React 15.6.0.
You can install the "react-icons" library using npm or yarn, and then use it in your React application like this:
import { FaStar } from 'react-icons/fa';
function MyComponent() {
return (
<div>
<FaStar />
<p>Star icon</p>
</div>
);
}
Note that since React 15.6.0 is a very old version, you may run into compatibility issues with other libraries and components, so it may be worth considering upgrading to a newer version of React if possible.
通过集体智慧和协作来改善编程学习和解决问题的方式。致力于成为全球开发者共同参与的知识库,让每个人都能够通过互相帮助和分享经验来进步。
评论