3.React学习笔记(完)----nodejs命令备份+跨域问题处理

nodejs常用命令

npm,cnpm和yarn

//安装所有模块
npm install
//安装 cnpm模块 并设置淘宝源
npm install -g cnpm --registry=https://registry.npm.taobao.org
//配置npm环境变量
npm config set prefix "path")
npm config set cache  "path")
npm config set registry https://registry.npm.taobao.org )//Yarn是facebook发布的一款取代npm的包管理工具。 安装yarn
npm install -g yarn
//配置yarn环境变量
yarn config  set global-folder "path"
call yarn config set cache-folder "path"
call yarn config set registry https://registry.npm.taobao.org -g
call yarn config set sass_binary_site http://cdn.npm.taobao.org/dist/node-sass -g

yarn和npm区别

初始化
npm init ==> yarn init
安装全部包
npm i  ==>  yarn
安装生产依赖包
npm i <package> --save  ==> yarn add <package>
安装开发依赖包
npm i <package> --save-dev  ==> yarn add <package> --dev
安装全局依赖包
npm install <package> --global(npm install -g <package>)    yarn global add [package]
移除依赖包
npm uninstall <package> ==> yarn remove <package>
更新全部依赖包
npm update  ==>  yarn upgrade
更新指定依赖包
npm update <package> ==> yarn upgrade <package>

####常用模块(命令以yarn为主)

静态服务模块
yarn add serve
andt组件库
yarn add antd
andt组件依赖模块
yarn add react-app-rewired customize-cra babel-plugin-import

eslint-react模块配置

eslint各种模块
yarn add eslint --dev
yarn add babel-eslint --dev
//airbnb 代码规范(包含ECMAScript 6 + 以及 React 的 ESLint 代碼規範,它會一同安裝 eslint, eslint-plugin-import, eslint-plugin-react, and eslint-plugin-jsx-a11y。如果你的項目不是 React 的話，那麼你可以選擇eslint-config-airbnb-base)
yarn add eslint-config-airbnb --dev
//eslint标准规则
yarn add eslint-config-google --dev
//eslint标准规则
yarn add eslint-config-alloy --dev
//eslint-react规则
yarn add eslint-plugin-react --dev
//eslint-vue规则
yarn add eslint-plugin-vue  --dev
//校验 import/export 语法，防止错误拼写文件路径以及导出名称的问题
yarn add eslint-plugin-import --dev
//提供 jsx 元素可访问性校验
yarn add eslint-plugin-jsx-a11y --dev
//提供 jsx 元素可访问性校验
yarn add eslint-plugin-jsx-a11y --dev

其他再补充

封装ajax模块

安装axios模块
yarn add axios

封装工具

/*
能发送异步ajax请求的函数模块
封装axios库
函数的返回值是promise对象
1. 优化1: 统一处理请求异常?在外层包一个自己创建的promise对象在请求出错时, 不reject(error), 而是显示错误提示
2. 优化2: 异步得到不是reponse, 而是response.data在请求成功resolve时: resolve(response.data)*/import axios from 'axios'
import {message} from 'antd'export default function ajax(url, data = {}, type = 'GET') {return new Promise((resolve, reject) => {let promise// 1. 执行异步ajax请求if (type === 'GET') { // 发GET请求promise = axios.get(url, { // 配置对象params: data // 指定请求参数})} else { // 发POST请求promise = axios.post(url, data)}// 2. 如果成功了, 调用resolve(value)promise.then((response) => {resolve(response.data)// 3. 如果失败了, 不调用reject(reason), 而是提示异常信息}).catch((error) => {// reject(error)message.error('请求出错了: ' + error.message)})})
}

/*
要求: 能根据接口文档定义接口请求
包含应用中所有接口请求函数的模块
每个函数的返回值都是promise基本要求: 能根据接口文档定义接口请求函数*/
import ajax from './ajax'// const BASE = 'http://localhost:5000'
const BASE = ''
// 登陆
/*
export function reqLogin(username, password) {return ajax('/login', {username, password}, 'POST')
}*/
export const reqLogin = (username, password) => ajax(BASE + '/login', {username, password}, 'POST')

处理跨域问题
安装jsonp

yarn add jsonp

配置 package.json
“proxy”: “http://localhost/”

效果

3.React学习笔记(完)----nodejs命令备份+跨域问题处理相关推荐

react render没更新_web前端教程分享React学习笔记（一）
web前端教程分享React学习笔记(一),React的起源和发展:React 起源于 Facebook 的内部项目,因为该公司对市场上所有 JavaScript MVC 框架,都不满意,就决定自己写 ...
React学习笔记：入门案例
React学习笔记:入门案例 React 起源于 Facebook 内部项目,因为市场上所有 JavaScript MVC 框架都不令人满意,公司就决定自己写一套,用来架设 Instagram 的网站 ...
react学习笔记1--基础知识
什么是react A JAVASCRIPT LIBRARY FOR BUILDING USER INTERFACES[React是一个用于构建用户界面的JavaScript库.] React之所以快, ...
react组件卸载调用的方法_好程序员web前端培训分享React学习笔记（三）
好程序员web前端培训分享React学习笔记(三),组件的生命周期 React中组件也有生命周期,也就是说也有很多钩子函数供我们使用, 组件的生命周期,我们会分为四个阶段,初始化.运行中.销毁.错误处 ...
React学习笔记(五) 状态提升
状态提升究竟是什么东西呢?别急,下面让我们一步一步来看看究竟要怎么使用状态提升假设我们有这样一个需求,提供两个输入框(分别属于两个组件),保证输入框里面的内容同步好,下面我们先来封装一个输入框组件 ...
React学习笔记 - 组件Props
React Learn Note 4 React学习笔记(四) 标签(空格分隔): React JavaScript 三.组件&Props 组件可以将UI切分成一些独立的.可复用的部件,这样你 ...
STATA学习笔记：外部命令
STATA学习笔记:外部命令 1.设置外部命令存储地址 //在电脑里设置好文件夹以备存储外部命令 //Set location where packages will be installed //方 ...
Ubuntu学习笔记：使用命令查看当前登录系统的用户信息
Ubuntu学习笔记:使用命令查看当前登录系统的用户信息 1 查看当前登录的用户名 2 查看当前登录的用户名.终端类型.时间.IP地址 3 服务器连接的所有用户及正在使用的进程 4 显示系统中有哪些使 ...
Ubuntu学习笔记：使用命令查询系统开机信息
Ubuntu学习笔记:使用命令查询系统开机信息 dmesg
oracle rman本地备份,【学习笔记】Oracle RMAN 备份集存储到远程其它服务器实现方法...
天萃荷净应运维DBA要求,将服务器本地Oracle数据库的RMAN备份集备份存储到远程其它服务器中,结合案例详细讲解实现步骤在linux中,要使用rman备份后传输到远程服务器上,可以选择ftp, ...

3.React学习笔记(完)----nodejs命令备份+跨域问题处理

nodejs常用命令

npm,cnpm和yarn

yarn和npm区别

其他再补充

3.React学习笔记(完)----nodejs命令备份+跨域问题处理相关推荐

最新文章

热门文章