很多人剛學(xué)習(xí)react的時(shí)候,往往因?yàn)榉爆嵉呐渲枚^疼,這里我將手把手教大家怎么用webpack配置react和redux的環(huán)境,這篇教程包括前端react和后臺(tái)node整個(gè)網(wǎng)站的環(huán)境配置,對(duì)node沒興趣的可以只看這篇。
這里是下篇鏈接:手把手教你webpack、react和node.js環(huán)境配置(下篇)
我把所有代碼都放到了github上面供參考:webpack-react-express環(huán)境配置
1. 什么是webpack?
Webpack 是當(dāng)下最熱門的前端資源模塊化管理和打包工具。它可以將許多松散的模塊按照依賴和規(guī)則打包成符合生產(chǎn)環(huán)境部署的前端資源。還可以將按需加載的模塊進(jìn)行代碼分隔,等到實(shí)際需要的時(shí)候再異步加載。通過 loader 的轉(zhuǎn)換,任何形式的資源都可以視作模塊,比如 CommonJs 模塊、 AMD 模塊、 ES6 模塊、CSS、圖片、 JSON、Coffeescript、 LESS 等。
2. 創(chuàng)建項(xiàng)目
先創(chuàng)建項(xiàng)目文件夾,我這里命名為blog,當(dāng)成一個(gè)博客項(xiàng)目,當(dāng)然你也可以命名成其他的。
mkdir blog && cd blog
接著用npm初始化這個(gè)項(xiàng)目。(使用npm之前需要先安裝node.js和npm)
npm init
這些內(nèi)容可以enter鍵全部跳過,結(jié)束后目錄里面會(huì)出現(xiàn)一個(gè)package.json文件,這個(gè)文件里面是我們項(xiàng)目的信息。
延伸閱讀
- ssh框架 2016-09-30
- 阿里移動(dòng)安全 [無線安全]玩轉(zhuǎn)無線電——不安全的藍(lán)牙鎖 2017-07-26
- 消息隊(duì)列NetMQ 原理分析4-Socket、Session、Option和Pipe 2024-03-26
- Selective Search for Object Recognition 論文筆記【圖片目標(biāo)分割】 2017-07-26
- 詞向量-LRWE模型-更好地識(shí)別反義詞同義詞 2017-07-26
- 從棧不平衡問題 理解 calling convention 2017-07-26
- php imagemagick 處理 圖片剪切、壓縮、合并、插入文本、背景色透明 2017-07-26
- Swift實(shí)現(xiàn)JSON轉(zhuǎn)Model - HandyJSON使用講解 2017-07-26
- 阿里移動(dòng)安全 Android端惡意鎖屏勒索應(yīng)用分析 2017-07-26
- 集合結(jié)合數(shù)據(jù)結(jié)構(gòu)來看看(二) 2017-07-26