1 webpack4 0 基礎配置

2021-09-22 08:30:25 字數 902 閱讀 1405

1.webpack環境的搭建

npm install webpack webpack -d    //開發環境受用

我使用的**編輯工具是vscode,安裝code runner外掛程式很方便

2.webpack的預設打包

(1).簡歷專案資料夾

(2).專案目錄結構

|-src

----index.js

|-index.html

(3).初始化專案  npm init -y

在index.js資料夾裡面寫一些東西,例如

console.log('start learning webpack!')

接著開啟cmd終端進入專案檔案(vscode直接按ctrl+`)

輸入:npx webpack

然後就會在專案資料夾上生成乙個dist資料夾,裡面有main.js。

現在在index.html裡面就可以引入這個main.js

3.webpack的基礎配置

在專案根目錄裡面建立乙個 webpack.config.js 檔案,用來寫配置

附上**:

let path = require('path');

'dist'))

module.exports =

}

第一節學習筆記完畢!

webpack4 0配置記錄(1)

趁著假期閒暇,練習下webpack4.0的一些配置。let uglifyjsplugin require uglifyjs webpack plugin let optimizecssassetsplugin require optimize css assets webpack plugin op...

webpack基礎配置 1

1.webpack配置 開啟我們在上文中操作的資料夾,webpackdemo dist node modules src index.html index.js package.json package lock.json 為了後期檔案便於管理,並且webpack的預設配置的打包入口檔案就是src資...

webpack配置 基礎配置

本片文章主要是一些webpack的基礎配置在webpack中,這個工具只識別js和json這兩種格式,別的格式或者說資源在webpack中是不認可的。例如 css檔案 less檔案 資源 圖示資源等等,這時候就需要用一些loader來對它們進行編譯處理。在敲 之前,一定要先安裝上面的包 安裝命令 n...