很多人剛學習react的時候,往往因為繁瑣的配置而頭疼,這里我將手把手教大家怎么用webpack配置react和redux的環(huán)境,這篇教程包括前端react和后臺node整個網(wǎng)站的環(huán)境配置,對node沒興趣的可以只看這篇。

這里是下篇鏈接:手把手教你webpack、react和node.js環(huán)境配置(下篇)

我把所有代碼都放到了github上面供參考:webpack-react-express環(huán)境配置

1. 什么是webpack?

Webpack 是當下最熱門的前端資源模塊化管理和打包工具。它可以將許多松散的模塊按照依賴和規(guī)則打包成符合生產(chǎn)環(huán)境部署的前端資源。還可以將按需加載的模塊進行代碼分隔,等到實際需要的時候再異步加載。通過 loader 的轉(zhuǎn)換,任何形式的資源都可以視作模塊,比如 CommonJs 模塊、 AMD 模塊、 ES6 模塊、CSS、圖片、 JSON、Coffeescript、 LESS 等。

2. 創(chuàng)建項目

先創(chuàng)建項目文件夾,我這里命名為blog,當成一個博客項目,當然你也可以命名成其他的。

mkdir blog && cd blog

接著用npm初始化這個項目。(使用npm之前需要先安裝node.js和npm)

npm init

iOS培訓,Swift培訓,蘋果開發(fā)培訓,移動開發(fā)培訓

這些內(nèi)容可以enter鍵全部跳過,結(jié)束后目錄里面會出現(xiàn)一個package.json文件,這個文件里面是我們項目的信息。

iOS培訓,Swift培訓,蘋果開發(fā)培訓,移動開發(fā)培訓

網(wǎng)友評論