webspa開發環境設定

2021-09-25 06:51:41 字數 1818 閱讀 8409

一般情況下已經配置過的專案請勿重複修改,出現問題後查詢下面文件修正區域性即可,或執行yarn自動安裝修正庫。

## 開發環境配置

1、進入專案後,執行:yarn add vue vue-router element-ui whatwg-fetch query-string uglifyjs-webpack-plugin

2、修改webpack.config.js檔案,為file-loader完善配置:test: /\.(png|jpg|gif|svg|woff|ttf|eot|woff2)$/,,重點將支援ttf\eot\woff\woff2四個字元庫,以支援內部得一些圖示特性。

3、啟動開發:yarn run dev

## 異常修復&重構專案配置

1、重構專案,在專案外側執行:yarn add vue-cli -g

2、重構專案:vue init webpack-****** server

3、進入專案:cd server

4、進行開發環境配置

5、在index.html的#id標籤內,增加**,以支援內部路由結構。

## vscode除錯

1、安裝vue、debug for chrome、webpack外掛程式

2、新增除錯命令

",

"sourcemaps": true,

"prelaunchtask": "dev"

}

3、新增dev任務

"label": "dev",

// 合起來就是`npm run dev`

"type": "npm",

"script": "dev"

4、這樣執行run dev除錯命令,即可除錯。

5、如果失敗,直接執行f5啟動除錯,或直接執行該任務即可。

6、另外一種方法是,直接執行dev-run.bat即可開始除錯模式,但不支援vscode控制。

## build後出現js無法轉化壓縮的錯誤?

這是因為uglifyjsplugin外掛程式預設不支援es6,有兩個解決方法:

1、降低code級別到es5,但這幾乎不可能;

2、使用yarn add uglifyjsplugin安裝外掛程式,之後修改webpack.config.js:

const uglifyjsplugin = require('uglifyjs-webpack-plugin');

plugins),

}

## 安裝node-sass報錯?

這是因為源無法獲取,需修改為:

yarn config set sass-binary-site 

之後再嘗試安裝即可。

## 圖示擴充套件庫fontawesome-vue

yarn add vue-awesome

在main.js中引用即可。

import vue from 'vue'

/* 在下面兩種方式中任選一種 */

// 僅引入用到的圖示以減小打包體積import 'vue-awesome/icons/flag'

// 或者在不關心打包體積時一次引入全部圖示import 'vue-awesome/icons'

/* 任選一種註冊元件的方式 */

import icon from 'vue-awesome/components/icon'

// 全域性註冊(在 `main .js` 檔案中)vue.component('v-icon', icon)

// 或區域性註冊(在元件檔案中)

export default 

}

設定OAF開發環境

設定開發環境 本文件介紹了如何配置和測試 oaf的開發環境 1 配置 jdev user home 環境變數 注意 如果跳過此步驟,jdeveloper 將不能正常工作。windows 在我的電腦屬性中新增新的環境變數 jdev user home jdevhome jdev 其中是你安裝 oaf開...

Tizen開發環境設定

在可以有tizen開發環境設定的一些相關資訊 這裡我們先實現看看如何配置並且連線上 首先需要先註冊獲得tizen.org的帳號,然後登入配置gerrit中的email以及全名等 然後建立ssh key 這條命令會建立ssh key pair,需要把公鑰 ssh id rsa.pub在gerrit u...

sublime Go開發環境設定

首先是安裝go,這裡有很詳細的安裝說明,或者 下面我們在window下面安裝,google有提供win安裝包,對於新手還是非常簡單的!直接下一步.安裝非常簡單!安裝完成後需要設定乙個 gopath 安裝好go以後,我們就可以搭建開發環境了,這裡我用的是 sublime text 2 gosublim...