SimonAllen

SimonAllen

Vue cli Error: No PostCSS Config found in xxxxx

在上傳本地專案到gitlab、github時,理所當然要把node_modules資料夾砍掉 反正clone下來npm install就好了 結果報錯 囧 乍看會以為是Bootstrap的問題,其實不是,因為Bootstrap確實存在於node_modules裡,重點是這句 No PostCSS Config found in xxxxx 上網查詢了一下,發現大家都有這個問題,原來這是webpack3以後才有的問題,這是關於webpack配置產生的錯誤 解決方法,在根目錄新增一個檔案postcss.config.js 沒錯就是根目錄喔,理論上是和package.json和readme.md同一層級 然後在postcss.config.js貼上以下內容 module.exports = { plugins: { 'autoprefixer': {browsers: 'last 5 version'} } } 存檔後再執行 npm install、npm
SimonAllen

Vue cli 安裝 Bootstrap4、Sass、jQuery 和 Popper.js

紀錄一下環境建置 首先建立vue cli專案 vue init webpack 專案名稱 或 vue init webpack-sample 專案名稱 接著 cd 專案名稱 npm 安裝套件 npm安裝Bootstrap 4 npm install bootstrap -S 現在install bootstrap會自動選bootstrap4 npm安裝jQuery npm install jquery -S npm安裝popper.js npm install popper.js -S npm安裝sass、sass-loader、node-sass npm install sass sass-loader node-sass -S -S等於—save,是要把相依寫入進package.json
SimonAllen

SQL 筆記:建立資料表與 SQL 的資料型態

建立 foods 資料表 建立資料表不等於建立資料,只是把表格的 欄 (column) 屬性定義建立好,實際每個 row 包含的資料(值)都還要之後 INSERT 進去。 以視覺化舉例來說,想建立一個如下的空表格: id name price cost 我們定義的僅是屬性欄位和該屬性的規範: id name price cost 所以要建立新表格並定義其包含屬性欄位 id、name、price、cost, 那語法可以這樣下: CREATE TABLE `foods` ( `id` int(11) unsigned NOT NULL AUTO_INCREMENT, `name` varchar(20) NOT NULL, `price` int(
SimonAllen

SQL 筆記:操作資料的 CRUD

在開發專案的過程中,資料庫是幾乎不會缺席的一環,如果我們想在網路上賣東西,我們需要記錄使用者在我們網站上註冊的資料、要販售的商品,以及訂單等等。 在設計一張資料表之前,我們會考慮到以下問題: * 這個資料表需要哪些欄位? * 欄位該如何命名? * 欄位的資料型態、長度是否必填? * 資料表的 Primary key (主鍵)是哪個欄位? 操作資料的 CRUD 接著我們會新增資料到資料庫中,並透過刪除、修改、查詢資料的語法做一系列操作。我們開發者常常聽到人講「CRUD」,這四個字分別指涉了以下四種動作 * Create:新增資料 * Read:讀取資料 * Update:更新資料 * Delete:刪除資料 它們是四種資料操作的基本指令,在開發應用程式時,每一個使用者需求的背後,開發者都需要思考這些需求對應在資料庫中的新增、讀取、更新與刪除等處理動作,因此,也會用「CRUD」來總括應用程式裡最常見的功能。 例如,如果是一個日記網站,可能會具有以下功能: * 新增一筆日記 * 瀏覽一筆日記 * 修改一筆日記
SimonAllen

CSS 重置 resetting 和標準化normalizing 的區別是什麼?

重置 resetting CSS 和 normalizing CSS 的區別是什麼? 因為每個瀏覽器預設的樣式都不一樣,也許A瀏覽器預設body是padding 2px、B瀏覽器預設body是padding 4px,但是我需要的是瀏覽器顯示:body的padding 0px,這時就可以使用resetting、normalizing來讓各瀏覽器的css效果,表面上看起來變得相同。 當然嚴格來說不是真的變相同,而是把resetting與normalizing作為第一個引入的css,他們覆蓋並統一瀏覽器預設樣式,好讓網頁設計師做其他覆蓋的樣式,在各瀏覽器預設也會相同。 先引入resetting、normalizing,在引入自己的CSS,這麼一來個瀏覽器都會相同樣式。 * 重置(Resetting): 重置意味著除去所有的瀏覽器默認樣式。對於頁面所有的元素,像margin、padding、font-size這些樣式全部置成一樣。你將必須重新定義各種元素的樣式。 * 標準化(Normalizing): 標準化沒有去掉所有的默認樣式,而是保留了有用的一部分,同時還糾正了一些常見
SimonAllen

Day30 心得-持續學習、持續成長

今天是鐵人賽第30天,很榮幸能參與這個活動並完賽。 第一天說要至少完成克服js的奇怪部分第6章節,而我也做到了,目前進度是: (有些地方會跳著看,第6章後不少段落已看完) 還是來點賽後檢討: 1. 時間分配不均 畢竟已開始上班,平日時間只剩白天的空檔或晚上可以利用,假日也不會全程坐在電腦前,在學習、筆記時間的拿捏還需要調整。 2. 效率不足 時間充足的狀況下,看完一段影片,縱使是先前就看過的段落或知曉的知識,還是需要點時間消化成文字。 有時消化著消化著就看使做其他事情,導致效率並不是很好,可能某段影片很短,但我卻看了3遍才真正進入狀況,浪費掉一些無謂的時間。 3. 惰性 承2,常發生電腦在播影片,我人坐在電腦前滑手機的狀況,尤其後期有點懶惰,每天都很想偷懶。 4. 文筆不夠流暢 學習時,腦子知道是一回事,但要轉換換成文字又是另一回事,這導致筆記有些部分太口語,有些又太流水帳,我的文筆潤飾還需要再加強。 上面最主要的問題點是2、3。   開賽前,為了不讓自己在30天