使用webpack搭建一个react项目目录

本文详细介绍了如何使用Webpack来搭建一个React项目。从全局安装Webpack和相关依赖,到初始化项目并创建必要的目录结构,再到配置Webpack配置文件,安装并配置Babel以支持JSX和ES6语法,最后设置热更新和打包命令。通过这些步骤,读者可以掌握创建React应用的基本流程。
摘要由CSDN通过智能技术生成

1.npm i webpack webpack-cli webpack-dev-server -g  全局安装webpack webpack-cli webpack-dev-server


2.npm init初始化项目,创建package.json文件


3.创建项目目录:
build文件夹=>webpack.base.config.js/webpack.dev.config.js 按照不同开发环境定义的项目webpack配置
src文件夹=>actions文件夹(redux的各actions文件)、reducers文件夹(redux的各reducers文件)、components文件夹(各公共小组件文件夹)、
containers文件夹(各页面总组件文件夹)、index.html(项目页面)、main.js(项目入口文件、react根文件)


4.npm i react react-dom react-router-dom --save-dev 安装react依赖,此时可以先写好入口文件main.js

import React, { Component } from 'react';
import ReactDOM from 'react-dom';

// 组件(页面)
import Layout from 
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值