创建项目名称为maqiu_web
mkdir maqiu_web
cd maqiu_web
使用yarn create-umi出事化项目
yarn create umi
###选择app
###选择dva
安装一下项目依赖
yarn add antd cross-env umi-plugin-react mockjs --save
在根目录下添加".umirc.test.js"、".umirc.prod.js"两个配置文件,内容相同
export default {
define: {
"process.env.BASEURL":'http://10.50.162.195:8102'
},
}
修改package.json文件中的scripts对象如下：
"scripts": {
"start": "cross-env UMI_ENV=dev umi dev",
"start:mock":"cross-env UMI_ENV=dev MOCK=none umi dev",
"build": "cross-env UMI_ENV=prod umi build",
"build:prod": "cross-env UMI_ENV=prod umi build",
"build:test": "cross-env UMI_ENV=test umi build",
"test": "umi test",
"lint": "eslint --ext .js src mock tests",
"precommit": "lint-staged"
},
在".umirc.js”文件对象中添加如下配置
define: {
'process.env.apiUrl': 'http://10.50.162.195:8102111',
},
publicPath: './',
//html静态资源文件路径
history: 'hash',
outputPath: './dist',
//生产目录
theme: {
// 设置antd的主题相关配置
'@primary-color': '#30b767',
},
在".umirc.js”文件对象中修该plugins如下
plugins: [
// ref: https://umijs.org/plugin/umi-plugin-react.html
[
'umi-plugin-react', // 开启umi集成的antd和dva，注意umi-plugin-react需要单独用npm i --save umi-plugin-react下载
{
antd: true,
dva: true,
dva: {
immer: true,
},
dynamicImport: false,
title: 'web-app',
dll: false,
hardSource: false,
routes: {
exclude: [
/model\.(j|t)sx?$/,
/service\.(j|t)sx?$/,
/models\//,
/components\//,
/services\//,
],
},
},
],
],
在跟目录src下新增app.js文件，内容下
export const dva = {
config: {
onError(err) {
err.preventDefault();
console.error(err.message);
},
},
};
在page目录下新增document.ejs文件，内容如下
<!doctype html>
<html>
<head>
<meta charset="utf-8" />
<title>Your App</title>
</head>
<body>
<div id="root"></div>
</body>
</html>
执行umi dev
网友评论