這個應該算簡單了吧 直接上文檔

項目地址

喜歡的話給個star吧！

webpack-multipage-template

A webpack multipage template project

開箱即用的 webpack 多頁面項目模板

項目初始化

# 克隆項目 git clone git@github.com:Binote/webpack-multipage-template.git#刪除遠程源 git remote rm origin#增加自己的倉庫地址 git remote add origin https://USERNAME:PASSWORD@github.com/USERNAME/pro.git# 安裝依賴 yarn install# 運行開發模式 yarn run dev# 編譯打包項目 yarn run build# 允許交互式git腳本，規范git提交 yarn run git# 啟用koa靜態服務器 yarn run start# 新增頁面模板 yarn run newpage# eslint代碼驗證 yarn run lint# eslint代碼驗證并修復 yarn run lint:fix復制代碼

pages 下面需要建立頁面包，頁面為包下 index.html 或者包名.html 文件，入口為 idnex.js 或者包名.js 文件，css 在 js 中引用

主文件為 index 或者包名任選一個，不能同時出現

目錄結構

├── README.md ├── build // webpack打包配置文件目錄 │ └── build.js // webpack打包腳本 │ └── entry-htmlPlugin.js // webpack多入口爬蟲腳本 │ └── utils.js // webpack工具文件 │ └── webpack.base.conf.js // webpack基礎配置 │ └── webpack.dev.conf.js // webpack開發模式配置 │ └── webpack.prod.conf.js // webpack生產模式配置 ├── config // webpack config ├── dist // webpack打包資源輸出目錄 ├── scripts // 腳本目錄 │ └── config // 腳本配置信息 │ └── git-commit.js // git交互式規范提交腳本 │ └── webserver.js // koa靜態服務器腳本 │ └── newpage.js // 新增頁面模板腳本 ├── src │ └── config // 頁面全局配置信息 │ └── lib // 第三方工具 │ └── pages // 頁面目錄 │ └── static // 靜態資源目錄 │ └── utils // 自定義工具庫 ├── utils //自定義node工具庫 │ └── fs // promise版fs ├── .babelrc // babel配置文件 ├── .eslintignore // eslint忽略 ├── .eslintrc // eslint配置文件 ├── .gitignore // git提交忽略 ├── .postcssrc // postcss配置文件 ├── package-lock.json └── package.json復制代碼

項目地址

轉載于:https://juejin.im/post/5c78a37651882540a702f2cb

創作挑戰賽新人創作獎勵來咯，堅持創作打卡瓜分現金大獎

總結

以上是生活随笔為你收集整理的webpack4.x多页面零配置项目模板的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。