⑴ Weex 架構分析
最近工作一直在搭建weex的項目架構，對於Weex開發需要理解很多概念並且需要強大的內心，因為還沒有比較成熟，所以坑比較多。但是公司團隊需要開發，所以在此記錄一些東西。
首先，我們得理解四種環境：
這幾種環境當然可以根據字面意思來理解，所以，我們在搭建所謂三端一致的環境的時候，我們需要區分這四種環境。
然後，利用Weex中搭建的腳手架框架weexpack構建的項目，大致的架構如下:
此架子大概幫我們已經搭建好了一個基本的開發思路，但是，我們可氏嫌以看出webpack的架子並沒有搭建比較完全，weexpack只是幫我們簡單的實現了打包與web端渲染。所以，我們需要自己根據的需求，讓其變得更加飽滿一點。
另外，關於weexpack 的調試問題困惑喊核大了作者很久，經查詢記錄於此:
1.在瀏覽器地址欄輸入： chrome://inspect/#devices
2.點擊如下：
3.在webpack的配置文件中加一個debugger
4.在你的package.json中添加一個新的script, run 即可。比如：
另外，weex 寫UI是不兼容Web大鄭豎多數標簽，需要使用它自己封裝的標簽，而且與vue不同的是，他打包的文件是通過每個頁面動態的打包，所以跳轉不是vue-router簡單的跳轉，而是通過其封裝的navigator進行頁面之間的跳轉的。
⑵ Vue 項目初步總結（在項目中遇到的問題以及解決辦法）
注意點：建議不要使用ESLint 後面選No 就ok 大神跳過此處，否則在項目中只要編碼格式有問題就會一直撥錯！
1、推薦使用Visual Studio Code工具打開testproject文件夾即可進行開發。
（1）（打開終端快捷鍵 control+~）在終端裡面輸入npm install命令安裝依賴包， npm install 執行可以進行vue已經vue的插件安裝，在第三步的時 候，已經初始化了項目，並且在 package.json 裡面已經有相關配置，所以在這里可以直接安裝；
（2）終端執行命令npm run dev 運行，然後覽器輸入localhost://8080即可看到vue初始界面
補充：使用vue 框架時盡可能的不要使用jq，但是有些地方確實需要使用jq的話下面是在vue中引入jq的方卜飢法
1：首先安裝jquery
npm install jquery --save
2：在webpack.base.conf.js里加入
var webpack = require("webpack")
3：在mole.exports的最後加入
plugins: [
new webpack.optimize.CommonsChunkPlugin('common.js'),
new webpack.ProvidePlugin({
jQuery: "jquery",
$: "jquery"
})
]
4：在main.js中引入
import $ from 'jquery'
5.最後 npm run dev就可以了
首先給圖片地址綁定變數
在script中設置變數
//方法1.直接將圖片引入為模塊
require imgUrl from "../assets/test.png"
//方法2.將imgUrl放在數據里
data(){
return {
imgUrl:require("../assets/test.png")
}
}
//方法3.在生命周期函數中設置
data(){
return {
imgUrl:""
}
}
created(){
this.imgUrl = require("@/"+urlTemp)
}
傳送門：https://www.cnblogs.com/aimiss/p/7396986.html
傳送門：https://www.json.cn/
基於 Promise 的 HTTP 請型謹返求客戶端，可同時在瀏覽器和 node.js 中使用
在瀏覽器中發送 XMLHttpRequests 請求
在 node.js 中發送 http 請求
支持 Promise API
攔截請求和響應
轉換請求和響應數據
自動轉換 JSON 數據
客戶端支持保護安全免受 XSRF 攻擊
使用 bower:
$ bowerinstallaxios
使用 npm:
$ npminstallaxios
例子
axios.post('/user',{
firstName:'Fred',
lastName:'Flintstone'
})
.then(function (response) {
console.log(response);
})
.catch(function (response) {
console.log(response);
});
傳送門：https://www.jianshu.com/p/e36956dc78b8；
一、污染是如何產生的？
得益於 Vue-loader，在 Vue 中可以使用類似於 Web Component 的組件化寫法, ，在大多數情況下，我們希望組件間定義的樣式是相互隔晌猛離的，在 Weex 當中的確如此，組件天生隔離，可是在 Vue 當中，運行的載體還是瀏覽器，所有的樣式類還是會通過 style 標簽插入頭部，影響全局，交叉污染
二、增加 Scoped 標識
依然是 Vue-loader，通過為組件中的 style 標簽增加一個 scoped 標識，Vue-loader 在編譯的過程中會為組件每一個元素節點增加 scopeId 作為屬性，同時為所有的樣式類加上屬性選擇器 scopeId，從而達到隔離的效果。
傳送門：https://www.jb51.net/article/122535.htm
假如，我們在A組建中聲明了一個定時器進行倒計時此時 我們在定時器中一直列印時間戳，此時我們通過路由跳轉到下一個組件頁面，按照正常理論來說，A組件在跳轉後整個組件就會被銷毀，到達B組件時A組件已經沒有了。
但是在我們有定時器的情況下 此時跳轉過後 定時器依然會存在。所以我們要在頁面銷毀時候將當前頁面的定時器clear掉。
格式轉換
伺服器給的格式是 2016-6-16 10:50:00 正則替換成 2016/6/16 10:50:00 即可；
var time = '2016-6-16 10:50:00'
var times = time.replace(/-/g,"/"); //2016/6/16 10:50:00
完美解決。
原因：因為當我們切出到任務管理器後台時，此時在客戶端中的瀏覽器裡面，瀏覽器就會終止定時器因為消耗性能，當我們返回的時候此時倒計時才會恢復正常。
解決：h5有一個監聽瀏覽器頁面是否隱藏的事件 visibilitychange 兩種狀態 hidden和visity hidden時候頁面切出此時我們要將定時器銷毀，visity時候再次恢復定時器。
解決 this.$router.push(0)
原因：因為低版本安卓不支持es6
（1）安裝依賴包
> cnpm install --save-dev babel-polyfill 或者 > npm install --save-dev babel-polyfill
（2）webpack配置修改
/* 添加 babel-polyfill */
entry: {
app: ["babel-polyfill", "./src/main.js"]
},
但是：我的項目上面的操作都進行了，也就是對es6進行了轉化但是失敗了。所以我就白有關es6的我寫的東西都改掉了。結果就好了。
傳送門：https://blog.csdn.net/qq_16559905/article/details/60755174
總結：初入前端，繼續踩坑。
⑶ 前端和Web前端有什麼區別嗎
web前端是指網站的前端開發，相對於後端而言，主要是給用戶呈現網站等界面。
web前端屬於IT行業中熱門的崗位，相比較於其他的IT技術來說，是比較簡單的。前端主要負責實現網站或者APP頁面，涉及的代碼量比後端開發小，但薪資和發展都不差，課程是目前前沿的前端技能叫web全棧工程師。
web全棧工程師5.0課程包括：
①計算機基礎以及PS基礎
②前端開發基礎（HTML5開發、JavaScript基礎到高級、jQuery網頁特效、Bootstrap框架）
③移動開發
④前端高級開發（ECMAScript6、Veu.js框架開發、webpack、前端頁面優化、React框架開發、AngularJS 2.0框架開發等）
⑤小程序開發
⑥全棧開發（MySQL資料庫、Python編程語言、Django框架等）
⑦就業拓展（網站SEO與前端安全技術）
互聯網行業目前還是最熱門的行業之一，學習IT技能之後足夠優秀是有機會進入騰訊、阿里、網易等互聯網大廠高薪就業的，發展前景非常好，普通人也可以學習。
想要系統學習，你可以考察對比一下開設有相關專業的熱門學校，好的學校擁有根據當下企業需求自主研發課程的能力，能夠在校期間取得大專或本科學歷，中博軟體學院、南京課工場、南京北大青鳥等開設相關專業的學校都是不錯的，建議實地考察對比一下。
祝你學有所成，望採納。
⑷ Chameleon 怎麼把編譯的weex打包apk
安裝 weexpack
weexpack create my-project //創建項目
cd my-project
cnpm install //安裝依賴
npm start //運行項目
weexpack platform add ios // 安裝應用模板 生成 ios項目 執行完之後再platforms文件下生成 ios文件夾
weexpack platform add android //安裝應用模板 生成android項目 執行之後在platform文件夾下生成android文件夾
打包android apk
weexpack run android //打包android apk
- 注意:`android.config.json` 或者 `ios.config.json`中的信息
- `AppName:` 生成的apk安裝後的應用名
- `AppId: `application_id 包名
- `SplashText:` 打開後歡迎頁上面的展示文字
- `WeexBundle: `指定的weex bundle文件（支持文件名和url的形式） 文件名則以本地文件的方式載入bundle,url則以遠程的方式載入bundle 如果以本地方式指定bundle .we
打包ios apk
weexpack run ios //模擬器運行 需要是mac才可以
weexpack build ios //構建ipa包
構建包的過程中，將會提示讓您輸入CodeSign（證書） ，Profile(provisioning profile),AppId，只有輸入真實的這些信息才能成功打包。 其餘如AppName,和入口weex bundle文件可以編輯項目目錄下的ios.config.json配置。
web打包
weexpack build web //打包h5項目
weexpack run web//運行web項目
鏈接：https://www.jianshu.com/p/674efb2468e4
原文地址：https://www.cnblogs.com/xiaofenguo/p/10337191.html
⑸ 2021前端開發的競爭大嗎我想學習前端開發，不知道前景如何
前端在未來幾年都是很好找工作的，初級前端競爭比較大，但是高級前端開發卻很少，主要是前端門檻低，但是精通各種框架的卻很少。
前端的入門門檻極低，體現在 HTML 和 CSS 上。前端開發已經不只是交互體驗這類問題了，隨著WEB軟體化、HTML5小程序的流行，逐步發展到了以更多功能開發為重點。
web前端有廣闊的發展空間，app、小程序、移動端、pc端等都網站是需要前端技術的開發支持才能夠完成，技術門檻相對較低、需求量較大，薪資待遇良好。只要是互聯網端的客戶界面，就需要前端來製作完成，前端開發的編程量不大，但是需要部分編程，入門簡單，但是要學的深入需要一個過程。
圖形學方向
前端自然是與圖形學有千絲萬縷的聯系，除了上面提到了可視化，還有相關3d引擎的開發工作。做這一行要求也非常高了，圖形學相關的演算法，3d引擎的開發，這都需要圖形學相關知識。
⑹ 前端開發前景怎麼樣
很多人選擇WEB前端，可能是因為WEB前端容易入門，而且不需要太多專業基礎。隨著前端的人才越來越逗，企業面試要求也越來越高，進階高級前端需要學習更多的技術，不斷積累技術經驗。
前端就是用戶可見部分的優化、交互功能開發，隨著軟體WEB化，Html5前端開發技術的發展，前端的技術方向越來越多，可開發解決的功能很多。
web前端有廣闊的發展空間，app、小程序、移動端、pc端等都是需要前端技術的開發支持才能夠完成，技術門檻相對較低、需求量較大，薪資待遇良好。只要是互聯網端的客戶界面，就需要前端來製作完成，前端開發的編程量不大，但是需要部分編程，入門簡單，但是要學的深入需要一個過程。
Web前端招聘崗位
• 前端開發工程師、Web開發工程師、網頁開發工程師、HTML開發工程師...
• H5開發工程師、移動應用開發工程師、App開發工程師、小程序開發工程師...
• JS開發工程師、Vue.js開發工程師、Node.js開發工程師、前端架構師...
• 小游戲開發工程師、數據可視化開發工程師、WebGL開發工程師、WebVR開 發工程師、Web安全工程師...
在互聯網行業，前端有WEB前端、HTML前端等，隨著互聯網技術發展，就業方向也有很多。web前端的就業方向有web架構師、web前端工程師、HTML前端開發工程師、網頁設計師等等。
HTML前端開發
與Web前端開發不同的是，使用HTML5不僅僅可以開發前端，還有網頁游戲，手機APP，使用瀏覽器進行3D渲染等一系列建立在HTML5標准與搭載其標准瀏覽器上的開發，而未來可能會有更多的功能分支並入HTML5標准。web前端工程師
這個方向是目前從事Web前端開發的主要就業方向
Web架構師
薪資普遍比較高，技術要求高，掌握多種技能，包括：後端技術、DBA、Platform等等，甚至包括網站優化SEO技術。
數據方向
數據研發這個是在Web開發的基礎上用數據附能，懂可視化的一定是有前端能力的，懂hadoop的一定java要熟悉，屬於Web開發的拓展方向。
大前端方向
比如阿里，在大量實踐rn和weex;由於公司內部安卓/ios式微，一定程度上，前端把ios和安卓收編了，統稱大前端。
圖形學方向
前端自然是與圖形學有千絲萬縷的聯系，除了上面提到了可視化，還有相關3d引擎的開發工作。做這一行要求也非常高了，圖形學相關的演算法，3d引擎的開發，這都需要圖形學相關知識。
⑺ Weex——公共樣式
所有 weex 標簽都有以下基本樣式規則。
weex 盒模型基於 CSS 盒模型，每個 weex 元素都可視作一個盒子。我們一般在討論設計或布局時，會提到「盒模型」這個概念。
元素實際的內容（content）、內邊距（paddings）、邊框（borders）、外邊距（margins），形成一層層的盒子包裹起來，這就是盒模型大體上的含義。
注意：目前在 <image> 和 <text> 組件上尚無法只定義一個或幾個角的 border-radius。比如你無法在這兩個組件上使用 border-top-left-radius。
weex 盒模型的 box-sizing 默認為 border-box，即盒子的寬高包含內容、內邊距和邊框的寬度，不包含外邊距的寬度。
示例：
weex 布局模型基於 CSS 的 Flexbox。以便所有頁面元素的排版能夠一致可預測，同時頁面布局能適應各種設備或者屏幕尺寸。
Flexbox 包含 flex 容器和 flex 成員項。如果一個 weex 元素可以容納其他元素，那麼它就成為 flex 容器。需要注意的是，flexbox 的老版規范相較新版有些出入，比如是否能支持 wrapping。這些都描述在 W3C 的工作草案中了，你需要注意下新老版本之間的不同。另顫念外，老版本只在安卓 4.4 版以下得到支持。
在 weex 中，Flexbox 是默認且唯一的樣式模型，所以你不需要手動為元素添加 display: flex; 屬性。
flex: <number>
flex 屬性定義了 flex 成員項在容器中占據的尺寸。如果所有成員項都設置為 flex: 1，那麼它們就有相等的寬度（水平排列）或者相等的高度（垂直排列）。如果一共有兩個成員項，其中一茄衫困個 flex: 1，另一個 flex: 2，那麼第一個將占據 1/3 的空間，另一個占據 2/3。如果所有 flex 成員項都不設置 flex 屬性，它們將根據容器的 justify-content 屬性來決定如何排列。
一組平分了容器的圖片。
一張固定寬度的圖片加上一段流動布局塌寬的文本。
復雜的混合布局。
一段文本左對齊，其他內容右對齊。
我們可以使用以下屬性來定位一個 weex 元素。
你可以按照以下步驟來規劃 weex 頁面的樣式。
⑻ 大二了，好煩啊，學的網路工程專業，現在也在學web前端開發，感覺都是懵懵懂懂的，不知道那個發展好，
建議大家剛開始學一定要靜下心來把基礎打好，不要只看視頻或者書籍，多動手去實踐。正確的前端學習路線：html語法、格式，常用的標簽極其作用，理解標簽的嵌套，學習使用firefox+firebug或者chrom的調試工具。CSS重點看盒子模型，定位，層級，過渡，動畫和 transform。知道原理和規則。大部分工作都是照著設計稿化。掌握上面幾個99%還原也不難。接下來重點學習幾種常見的布局。學完之後去學flex。最後sass、less，基本就差不多了。千鋒軟體開發培訓課程的授課模式採用全程面授，講師成本雖高，但是效果卻是顯著的，和學員面對面溝通，了解到學員在學習過程中遇到的問題，動態地調整授課方式。千鋒教育就有線上免費的軟體開發公開課，
HTML、CSS學完可以製作出簡單的靜態頁面。js的執行順序，基本的編程基礎（變數、運算、流程式控制制、數組、調用函數、自定義函數、對象）、json、js的dom操作、js的事件機制（委託、綁定、監聽，冒泡和阻止冒泡，兼容性）了解ajax的xmlhttprequest及其創建方法（多瀏覽器兼容）、跨域，明白其工作原理，熟悉http協議。js學完可以實現運用js語言為頁面增加動態效果，達到用戶交互的目的。千鋒教育集團目前已與國內4000多家企業建立人才輸送合作，與500多所大學建立實訓就業合作，每年為各大企業輸送上萬名移動開發工程師，每年有數十萬名學員受益於千鋒教育組織的技術研討會、技術培訓課、網路公開課及免費教學視頻。
⑼ web網頁開發的發展前景咋樣
1、市場前景
前端程序員缺口非常大，因為它正式成為一個崗位才幾年，國內最早出現前端招聘崗位在2012年左右。隨著現代互聯網應用的火爆，前端難度加大，導致後台程序員不能完全搞定，所以企業們急切需要真正懂前端技術的「前端人員」。
近十年以來，IT行業發展火熱，衍生了很多新職業，例如UI設計師、開發工程師、軟體測試工程師等等，在眾多備受矚目的新生職業中，Web前端工程師是其中的一員。
隨著互聯網的迅猛發展，各種互聯網項目也不斷興起，對用戶體驗提出了更高的要求，前端開發也由此逐漸成為了重要的研發角色。從2012年至今，「Web前端工程師」的需求持續走高，薪酬也是水漲船高，所以，有不少人立志要成為前端開發工程師。
2、就業形勢
Web前端可選擇的崗位有：前端開發工程師、資深前端開發工程師、網站重構工程師、前端架構師等等。
雖然近兩年大數據、人工智慧等很火，但Web前端開發依然是十分熱門的，特別是隨著谷歌、YouTube、FireFox等大型企業紛紛將視線轉向HTML5，前端開發已經進入HTML5時代，所以，Web前端在今後十年仍有很大的發展空間。
據統計，我國HTML5前端工程師人員的缺口將達到10多萬，因此，Web前端工程師是一個非常有「錢」途的職業，並且薪酬會根據技能的深入而有不同程度的增長，其中北京、上海、廣州、深圳等地前端工程師的薪資待遇更是一路飆升。
3、說完了前景狀況，接下來就是學習前端了，前端入門雖簡單，但也並不是人人都能從事這個行業的，如何鑒定自己適不適合學前端呢？
1. 你是否能耐得住性子？學習web前端接觸得最多就是各種繁復的字母代碼，需要你耐得住性子安安靜靜地坐下來研究技術。如果你做事經常三分鍾熱度，容易半途而廢、或是性格急躁急於求成，編程可能不太適合你。
2. 你是否有持之以恆的毅力？web前端不僅知識點多，而且前端發展得快，新的框架和思想被不斷的提出，對於新手來會有不小的心理壓力，過快的節奏讓新手學起來比較吃力，想要學習web前端就要做好做好長期學習，更新自己知識庫的准備，持之以恆的毅力才能讓你在長途跋涉的工作過程中堅持下來。
3. 是否具備基本的邏輯思維？選擇工科專業的人一般邏輯思維能力一般要強於文科生，web前端需要用邏輯思維處理問題的能力。針對甲方用代碼實現，首先要自己理解透徹，編寫出來的程序才能拒絕bug。
如果以上提到問題，你都能從容攻克，那麼你是適合學習web前端的。
4、到這里呢，先恭喜你進入前端行業，接下來就是如何學習前端了，前端的學習路線是什麼呢？
零基礎學習路線：
1、HTML、CSS基礎、JavaScript語法基礎。學完基礎後，可以仿照電商網站（例如京東、小米）做首頁的布局。
2、JavaScript語法進階。包括：作用域和閉包、this和對象原型等。相信我，JS語法，永遠是面試中最重要的部分。
3、jQuery、Ajax等。jQuery沒有過時，它仍然是前端基礎的一部分。
4、ES6語法。這部分屬於JS新增的語法，面試必問。其中，關於 promise、async 等內容要尤其關注。
5、HTML5和CSS3。要熟悉其中的新特性。
6、移動Web開發、Bootstrap等。要注意移動開發中的適配和兼容性問題。
7、前端框架：Vue.js和React。這兩個框架至少要會一個。入門時，建議先學Vue.js，上手相對容易。但無論如何，同時掌握 Vue 和 React 才是合格的前端同學。
8、Node.js。屬於加分項，如果時間不夠，可以先不學，但至少要知道 node 環境的配置。
9、自動化工具：構建工具 Webpack、構建工具 gulp、CSS 預處理器 Sass 等。注意，Sass 比 Less 用得多，gulp 比 grunt 用得多。
10、前端綜合：HTTP協議、跨域通信、安全問題（CSRF、XSS）、瀏覽器渲染機制、非同步和單線程、頁面性能優化、防抖動（Debouncing）和節流閥（Throtting）、lazyload、前端錯誤監控、虛擬DOM等。
11、編輯器相關。Sublime Text 是每個學前端的人都要用到的編輯器。另外，前端常見的IDE有兩個：WebStorm 和 Visual Studio Code。WebStorm 什麼都好，可就是太卡頓；VS Code就相對輕量很多。個人總結一下：用VS Code 的人越來越多，用 WebStorm 的人越來越少。
12、TypeScript（簡稱TS）。ES 是 JS 的標准，TS 是 JS 的超集。TS屬於進階內容，建議把上面的基礎掌握之後，再學TS。