- 博客(24)
- 收藏
- 关注
RSS订阅原创 nvm的使用
切换使用指定Node版本，可选参数arch可指定32位还是64位，可能会失败报exit status 5 或 exit status 1，原因是当前CMD窗口是user权限，使用管理员打开CMD窗口即可。：后面加版本号是安装指定版本的Node,不加表示安装最新版本,和nvm install latest通用，可选参数arch可以指定32位还是64位，默认是电脑系统位数。：查看和设置Node源镜像地址，没有url参数显示setting.txt中node_mirror，没有设置使用默认镜像地址。
2023-11-24 10:46:00
51
原创 nginx 命令记录
// 启动nginx服务start nginx// 查看nginx任务进程是否运行tasklist /fi “imagename eq nginx.exe”// 检查配置文件（nginx.conf）是否正确nginx -t -c /nginx-1.15.2/conf/nginx.conf// 重新加载配置并重启nginx -s reload// 快速停止nginxnginx -s stop// 完整有序的关闭nginxnginx -s quit详细参照：https://www.cnb
2022-03-29 16:36:56
434
原创 ts入门笔记
// 环境检查node -vnpm -vtsc -v// ts配置tsc init 生成tsconfig.jsontsconfig.json 配置 rootDir outDir// 测试ts写index.ts文件做测试tsc 把ts文件生成js文件node ./dist/index.js 看运行结果node ./src/index.ts 报错，因为ts不能直接运行// 类型any 类型 任意类型never 类型 当函数永远执行不完的时候，就是nevervoid 类型 当函数没有
2022-03-01 14:30:19
406
原创 react-router-dom
传参方式1.通配符传参优点：页面刷新，参数不丢失缺点：只能传递字符串<Route path='/path/:name' component={Path}/><Link to="/path/通过通配符传参">通配符</Link>this.props.match.params.name // 获取参数2.query...
2019-05-25 14:17:24
182
原创 nextJS 配置项
可配置内容const withCss = require('@zeit/next-css')// 配置说明const configs = { // 编译文件的输出目录 distDir: 'build', // 是否给每个路由生成Etag // Etag是用来做缓存验证的，如果路由执行的时候，新的Etag是相同的，那么就会复用当前内容，而无需重新渲染 ...
2019-05-19 18:49:58
4538
2
原创 webpack.DefinePlugin
DefinePlugin 作用可以创建一个在编译时可以配置的全局常量。主要针对我们在编译时，区分 开发、测试、生产环境。示例new webpack.DefinePlugin({ PROCESS.VERSION: JSON.stringify('2.0.1'), PROCESS.ENVIRONMENT: '"dev"'})注：1.值格式：因为DefinePlugin...
2019-05-19 17:51:34
1492
原创 nextJS 懒加载
什么是懒加载当路由导航到某个模块，或者某个组件的时候，才加载那个模块/组件的js文件。模块懒加载第一步，先选择一个需要懒加载的插件，我们拿moment做例子。先安装它：npm install moment -s第二步，在页面里，用moment写一个例子const Task = ({ time }) => ( <div> <span>...
2019-05-19 14:03:19
1631
原创 nextJS搭建
// 手动搭建nextJS第一步：初始化一个package.jsonnpm init第二步：安装next.jsnpm install --save next react react-dom第三步：配置启动命令，然后启动{“scripts”: {“dev”: “next”,“build”: “next build”,“start”: “next start”}}npm ru...
2019-05-19 11:01:59
2325
原创 nextJS路由
// pages ---路由文件// --_app.js ---启动文件，不走路由// --_document.js ---宿主文件，不走路由// --a.js ---可通过http://localhost:3000/a 进行访问// --b.js ...
2019-05-19 11:01:50
3857
原创 nextJS数据获取规范
getInitialProps它是nextJS提供给我们进行数据获取的功能。它只针对pages/内的component使用。它可以在路由跳转时提前获取数据，并且可以在App中获取全局数据。它可以帮助我们把客户端和服务端的数据进行同步，这是我们在服务器端渲染最大的痛点之一。有了它之后，我们要尽可能的把跟页面数据获取相关的内容放到getInitalProps里面，而不是像以前一样放在comp...
2019-05-19 11:01:38
1680
原创 nextJS自定义App
作用1.固定Layout2.保持一些公用的状态3.给页面传入一些自定义数据4.自定义错误处理示例_app.jsimport App, { Container } from 'next/app'import 'antd/dist/antd.css'import Layout from '../components/work/layout'class AntApp extends ...
2019-05-19 11:01:32
1490
原创 nextJS styled-jsx 的使用
作用1.可以根据组件，按需加载，卸载时一起卸载2.不会形成样式命名冲突示例import { withRouter } from 'next/router'const Task = ({ router,fzr }) => ( <div> {/* 定义当前页面样式 */} <style jsx>{` ...
2019-05-19 11:01:23
877
原创 nextJS自定义document
_document.js是什么1.它只有在服务端渲染的时候才会被调用，客户端渲染，它是不会起任何作用的2.它用来修改服务端渲染的文档内容3.一般用来配合第三方css-in-js方案使用示例import Document, { Html, Head, Main, NextScript } from 'next/document'class AntDocument extends Doc...
2019-05-19 11:01:18
2836
原创 nextJS styled-components 集成
为什么要集成如果做服务器端渲染，那就需要拿到css的文本，然后在把它放入body的head中，一起变成html模板传递给客户端。集成步骤第一步，安装styled-components和babel-plugin-styled-componentsnpm install styled-components babel-plugin-styled-components -s第二步，添加babe...
2019-05-19 11:01:12
1371
原创 nextJS集成antd
nextjs 默认不支持css文件的问题解决解决方法：修改nextjs的默认配置，使用@zeit/next-css插件第一步：安装npm i @zeit/next-css -s第二步：创建next.config.js，并写配置// 让nextjs支持css的配置const withCss = require('@zeit/next-css')if (typeof require !=...
2019-05-19 11:00:57
2234
原创 react 全栈概念学习
// 为什么要用next.js因为前端框架如react,angular是把js加载到浏览器之后，再去渲染出内容的，这样会导致：1.首屏展示速度慢2.无法seo3.初始数据只能向服务器请求而这些问题，在同构项目中都可以解决。// react16本身推出了server runder工具实现服务器端渲染，但是它的构建太复杂，所以目前选择next.js做react的同构项目，是非常好的选择。...
2019-05-17 21:45:52
619
原创 http地址转码
// 地址加密var url = “http://www.baidu.com?a=1&b=2”;var mUrl = encodeURIComponent(url);mUrl => “http%3A%2F%2Fwww.baidu.com%3Fa%3D1%26b%3D2”// 地址解密decodeURIComponent(mUrl) =>“http://www.baid...
2019-03-20 08:22:43
12275
原创 git 使用
// 代码提交git status // 查看状态git add 文件名/路径 // 设置要提交的文件 // 提交到git的暂存空间git add . // 设置要提交当前打开目录的所有文...
2019-02-25 17:24:08
400
原创 ES基础学习-模板字符串
// 模板字符串特性可以放变量可以折行例一：let name=‘join’,age=18;console.log(我叫${name},今年${age}岁了);=> 我叫join,今年18岁了用ES5 实现 ES6的模板字符串let name=‘join’,age=18;let desc = “name今年{name}今年name今年{age}岁了”function ...
2019-02-21 18:24:53
267
原创 ES6基础学习-解构赋值
例一：let arr = [1,2,3];let [ one, two, three ] = arr;one=> 1two=> 2three=> 3例二：let arr2 = [ {name: ‘liu’, age: 9}, [1,2], 3 ];let [ {name, age}, [one,two], three ] = arr2;name => “...
2019-02-21 15:09:40
76
原创 ES6基础学习 - let和const
var：1.可以重复声明2.不能定义常量3.不支持块级作用域，ES5只有全局和函数级作用域4.有声明提升let：1.同作用域内不可以重复声明2.有块级作用域3.没有声明提升const：1.定义常量，不能修改它的值2.定义常量，如果是引用类型的值，则可修改它引用的值。比如：const man = { name:‘join’, age: 15 };man.age = 18;...
2019-02-21 14:46:58
77
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人