乙個基於vueCli3的移動端多頁面腳手架

2021-09-26 01:47:55 字數 2027 閱讀 7548

基於vue-cli3.0 + [email protected]的多頁腳手架

線上demo:

編譯速度與熱跟新速度要優於webpack2.0、3.0,但相應的消耗記憶體變大,在node**現記憶體溢位現象,如頁面過多,使用

npm run fix-memory-limit
再進行

npm run dev
npm install
npm run dev
npm run build:dev  //打包開發環境

npm run build:devtest //打包開發測試環境

npm run build:test //打包測試環境

npm run build // 打包正式環境

在config裡配置不同的打包環境使用不同的api位址等。

乙個基於vue-cli3腳手架的多頁面vue移動端模板

|-- dist                             // 打包目錄

|-- src // 原始碼目錄

| |-- components // 全域性元件

| |-- utils // 工具函式。

| |-- arrmethods.js // 陣列函式

| |-- back.js // 返回事件

| |-- request.js // 請求封裝

| |-- changeurl.js // 頁面跳轉

| |-- elemethods.js // dom方法

| |-- time_slot_change.js // 時間方法

| |-- pages // 頁面檢視

| |-- home // 首頁模組資料夾

| |-- index // 首頁資料夾

| |-- index.vue // 首頁模板檔案

| |-- index.js // 首頁js檔案

| |-- home1 // 首頁內頁資料夾

| |-- home1.vue // 首頁內頁模板檔案

| |-- home1.js // 首頁內頁js檔案

| |-- discover // 發現模組資料夾

| |-- discover // 發現資料夾

| |-- discover.vue // 發現模板檔案

| |-- discover.js // 發現js檔案

|-- .gitignore // 忽略的檔案

|-- page.config.js // 使用node讀取pages資料夾下的資料夾配置到vue cli3

|-- vue.config.js // vue cli 配置

|-- readme.md // 說明

|-- package.json // 資源包

使用vue cli 3搭建乙個專案

官方建議,node.js的版本,需要是8.9或者以上 建議是8.11.0 npm install g vue cli vue3.x同樣支援這種方式 vue init webpack project name 我們用最新的建立方式 這裡推薦選擇第二個,第乙個預設沒有 router 和 vuex,個人選...

專案實戰 乙個完整的vue cli3架子

收費規則 chargingrules div template 例如 import 元件名稱 from 元件路徑 export default data 監聽屬性 類似於data概念 computed 監控data中的資料變化 watch 生命週期 建立完成 可以訪問當前this例項 created...

vuecli3 external的乙個注意事項

之間有寫過一篇external和import,package.json的關係 專案中有乙個tui editor的依賴,然後目前external是這樣配置的 把jquery給排除了 由於tui editor中依賴了jquery,那麼在打包時便會導致部分 不生效,關鍵是tui editor執行時也不報錯...