多入口react项目脚手架
public
template.html
template.css
favicon.jpn
src
page1
page2
index.jsx
index.html
index.css
一、如果模板文件使用ejs,则balel-loader要排除ejs
二、html中的img标签由请使用如下形式引入,不需要使用html-loader,因为它与html-webpack-plugin相冲突
<img src="<%= require('./assets/img/logo.svg') %>" alt="">
三、在函数组件中使用副作用钩子
1、在componentDidMount与componentUpdate中自动调用副作用钩子函数
const [count,updateCount]=useState(0)
useEffect(() => {
document.title=`you clicked ${count} times`
});
2、传入空数组,只在中调用一次componentDidMount
const [count,updateCount]=useState(0)
useEffect(() => {
document.title=`you clicked ${count} times`
},[]);
3、传入指定状态的数组,只在中调用一次componentDidMount,并在前一个count与当前传入的count值不相同时才执行副作用操作
const [count,updateCount]=useState(0)
useEffect(() => {
document.title=`you clicked ${count} times`
},[count,id]);//仅在count或者id更改时更新
2、返回一个清理函数,则会在componentWillUnMount中调用该函数
const [count,updateCount]=useState(0)
useEffect(() => {
document.title=`you clicked ${count} times`
return function cleanup(){
//执行清理方法
}
});
我们推荐启用 eslint-plugin-react-hooks 中的 exhaustive-deps 规则。此规则会在添加错误依赖时发出警告并给出修复建议。
webpack.config中的filename,name,publicPath,outputPath都可以是函数
此处可能存在不合适展示的内容,页面不予展示。您可通过相关编辑功能自查并修改。
如您确认内容无涉及 不当用语 / 纯广告导流 / 暴力 / 低俗色情 / 侵权 / 盗版 / 虚假 / 无价值内容或违法国家有关法律法规的内容,可点击提交进行申诉,我们将尽快为您处理。