webpack 簡單配置

2022-04-11 13:40:51 字數 1241 閱讀 1412

const extracttextplugin = require('extract-text-webpack-plugin')     //

打包的css拆分,將一部分抽離出來

const webpack = require('webpack'); //

引入的webpack,使用lodash

const htmlwebpackplugin = require('html-webpack-plugin') //

將html打包

const path = require('path'); //

引入node的path模組

const copywebpackplugin = require('copy-webpack-plugin')

module.exports = function

() ,

optimization:

},resolve: ,

modules: [

//模組的查詢目錄

path.resolve(__dirname, '../node_modules')

],extensions: [".js", ".json", ".jsx", ".css"], //

用到的檔案的擴充套件

}, module: ,

//css 引入外來或者公共樣式,與模組式css混淆會導致 外來樣式不認識

//此時 公共樣式統一放在 assets資料夾下

) },

//css 模組兒化配置}]

})},

]}, ]}

],},

plugins: [

//提取css

new extracttextplugin('style.css'),

//直接複製過去的樣式檔案

new copywebpackplugin([ //

src下其他的檔案直接複製到dist目錄下

]),//此處的入口位址一定要寫正確哦

newhtmlwebpackplugin()

],};

}

package.json

,

"keywords": ,

"author": "",

"license": "isc",

"devdependencies": ,

"dependencies":

}

webpack的那些簡單配置

這是webpack的配置檔案的樣式,簡單介紹一下專案中的實現,就是在專案中新增webpack的引用,然後再專案中新增webpack.con.js檔案,然後就是配置了 小知識 元件 element控制項也挺好使得,可以嘗試一下!use strict const path require path co...

webpack的簡單配置 jQuery

需要根目錄webpack.config.js src index.js src indxe.html 打包使用了外掛程式html就會掛載輸出在根目錄下面 雖然看不見但是存在 替換vue配置在這一期 dependencies devdependencies babelrc檔案內容 如下是webpack...

webpack2 0簡單配置教程

以前習慣用gulp less來開發專案,由於公司專案用的vue開發的,所以學下webpack這個打包工具。以下是我學習時的筆記,希望給在webpack配置過程中遇到麻煩的朋友一絲幫助。目前只配置了sass,css,js,html,es6,編譯,字型引入,熱載入這幾項,簡單專案已經夠用。如果深入web...