2020-04-25 02:48:27 struggle_WDJR 阅读数 86
  • Portal定制开发介绍

    对目前主流的前端开发框架有一个基础性的学习 学会React和Vue中ArcGIS API for JavaScript的使用 学会主流前端框架下WebGIS系统的整体开发

    27649课时 0分钟 6人学习 X北辰北
    免费试看

安装element-react

npm i element-react --save

安装默认主题

npm i element-theme-default --save

安装完成后试用报错如上,不能解析 ‘react-hot-loader’
./node_modules/element-react/dist/npm/es5/libs/animate/transition.js
Module not found: Can’t resolve ‘react-hot-loader’ in ‘…’

满脸无奈,
解决方法下载安装‘react-hot-loader’

npm i react-hot-loader@next --save

安装好之后就运行项目,就没问题啦!

2019-01-01 14:31:41 August_leo 阅读数 6600
  • Portal定制开发介绍

    对目前主流的前端开发框架有一个基础性的学习 学会React和Vue中ArcGIS API for JavaScript的使用 学会主流前端框架下WebGIS系统的整体开发

    27649课时 0分钟 6人学习 X北辰北
    免费试看

根据官方文档在 React 中使用 element-ui

Step 1:npm 安装

npm i element-react --save

Step 2:下载主题包

npm install element-theme-default --save

Step 3:在 React 中使用

打开需要使用到 element-ui 的 jsx 文件,在头部添加

import React from 'react';
import ReactDOM from 'react-dom';
import { Button } from 'element-react';

import 'element-theme-default';

Step 4:测试效果

可在此页面添加如下代码进行测试:

ReactDOM.render(<Button type="primary">Hello</Button>, document.getElementById('app'));
2018-08-21 11:29:27 weixin_38852390 阅读数 3419
  • Portal定制开发介绍

    对目前主流的前端开发框架有一个基础性的学习 学会React和Vue中ArcGIS API for JavaScript的使用 学会主流前端框架下WebGIS系统的整体开发

    27649课时 0分钟 6人学习 X北辰北
    免费试看

最近在学习react时候无意中接触到了element-react,感觉文档和界面做的都很漂亮,所以决定用elemet-react快速构建一款后台管理系统。下面是一些效果

2020-03-16 16:55:00 weixin_43254676 阅读数 115
  • Portal定制开发介绍

    对目前主流的前端开发框架有一个基础性的学习 学会React和Vue中ArcGIS API for JavaScript的使用 学会主流前端框架下WebGIS系统的整体开发

    27649课时 0分钟 6人学习 X北辰北
    免费试看

./node_modules/element-react/dist/npm/es5/libs/animate/transition.js
Module not found: Can’t resolve ‘react-hot-loader’ in ‘…’

react项目引入element-react 官网步骤分2步

安装element-react

npm i element-react --save

安装默认主题

npm install element-theme-default --save

安装完成后试用报错如上,不能解析 ‘react-hot-loader’

解决办法:

安装 ‘react-hot-loader’

npm install react-hot-loader@next --save
2019-06-19 11:33:05 qq_26190177 阅读数 626
  • Portal定制开发介绍

    对目前主流的前端开发框架有一个基础性的学习 学会React和Vue中ArcGIS API for JavaScript的使用 学会主流前端框架下WebGIS系统的整体开发

    27649课时 0分钟 6人学习 X北辰北
    免费试看

1.安装create-react-app,npm install -g create-react-app

2.新建一个项目,create-react-app manager

3.进入项目,安装组件,cd manager——npm i element-react --save——npm install element-theme-default --save

4.此时启动项目npm start会报错:

D:\sdf\manager_react_\manager>npm start

> manager@0.1.0 start D:\sdf\manager_react_\manager
> react-scripts start

'react-scripts' 不是内部或外部命令,也不是可运行的程序
或批处理文件。
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! manager@0.1.0 start: `react-scripts start`
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the manager@0.1.0 start script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.

npm ERR! A complete log of this run can be found in:
npm ERR!     C:\Users\SEELE\AppData\Roaming\npm-cache\_logs\2019-06-19T02_46_23_451Z-debug.log

5.终止运行后执行npm install后安装缺少的依赖,npm install typescript@*,然后重新启动npm start,继续报错:

D:\sdf\manager_react_\manager>npm start

> manager@0.1.0 start D:\sdf\manager_react_\manager
> react-scripts start

Starting the development server...

BrowserslistError: Unknown browser query `android all`
BrowserslistError: Unknown browser query `android all`
BrowserslistError: Unknown browser query `android all`
BrowserslistError: Unknown browser query `android all`
BrowserslistError: Unknown browser query `android all`
BrowserslistError: Unknown browser query `android all`
BrowserslistError: Unknown browser query `android all`
BrowserslistError: Unknown browser query `android all`
BrowserslistError: Unknown browser query `android all`
BrowserslistError: Unknown browser query `android all`
BrowserslistError: Unknown browser query `android all`
BrowserslistError: Unknown browser query `android all`
Failed to compile.

./node_modules/element-react/dist/npm/es5/libs/animate/index.js
Module not found: Can't resolve 'react-hot-loader' in 'D:\sdf\manager_react_\manager\node_modules\element-react\dist\npm\es5\libs\animate'

6.终止运行后执行npm install react-hot-loader@next --save,更新react-hot-loader,然后重新启动npm start,成功运行:

D:\sdf\manager_react_\manager>npm start

> manager@0.1.0 start D:\sdf\manager_react_\manager
> react-scripts start

Starting the development server...

BrowserslistError: Unknown browser query `android all`
BrowserslistError: Unknown browser query `android all`
BrowserslistError: Unknown browser query `android all`
BrowserslistError: Unknown browser query `android all`
BrowserslistError: Unknown browser query `android all`
BrowserslistError: Unknown browser query `android all`
BrowserslistError: Unknown browser query `android all`
BrowserslistError: Unknown browser query `android all`
BrowserslistError: Unknown browser query `android all`
BrowserslistError: Unknown browser query `android all`
BrowserslistError: Unknown browser query `android all`
BrowserslistError: Unknown browser query `android all`
Compiled successfully!

You can now view manager in the browser.

  Local:            http://localhost:3000/
  On Your Network:  http://192.168.1.104:3000/

Note that the development build is not optimized.
To create a production build, use yarn build.


7.终止运行后执行npm run eject暴露配置信息,报错:

This git repository has untracked files or uncommitted changes:

.gitignore
M .idea/workspace.xml
D README.md
D manager/.idea/inspectionProfiles/Project_Default.xml
D manager/.idea/manager.iml
D manager/.idea/misc.xml
D manager/.idea/modules.xml
manager/.idea/workspace.xml
M manager/src/App.js
D package.json
D public/favicon.ico
D public/index.html
D public/manifest.json
D src/App.css
D src/App.js
D src/App.test.js
D src/index.css
D src/index.js
D src/logo.svg
D src/serviceWorker.js
D yarn.lock

Remove untracked files, stash or commit any changes, and try again.
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! manager@0.1.0 eject: `react-scripts eject`
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the manager@0.1.0 eject script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.

npm ERR! A complete log of this run can be found in:
npm ERR!     C:\Users\SEELE\AppData\Roaming\npm-cache\_logs\2019-06-19T02_57_13_690Z-debug.log


8.依次执行git init——git add .——git commit -m "init"——npm run eject,执行成功;

9.在App.js中引入element-react后测试,执行npm start,成功运行。