2020/06/15
[PHP] 解決執行 Composer 出現 PHP Fatal error: Allowed memory size exhausted 的問題
markdown
### 問題
今天在執行 composer require 套件安裝時出現 PHP Fatal error: Allowed memory size of xxx bytes exhausted 的錯誤訊息
### 解決方法
1. 在 `php.ini` 加大 `memory_limit` 或是設 `memory_limit = -1` (不限制)
2. 使用命令 `php -d memory_limit=-1 composer.phar`
### 參考連結
- [Composer trouble shooting: memory-limit-errors](https://getcomposer.org/doc/articles/troubleshooting.md#memory-limit-errors)
2020/06/14
[Laravel] 解決 Sqlite 在 migration 退版時發生不支援 dropColumn 或 renameColumn 多重呼叫的問題
markdown
### 問題
在 Laravel 使用 Sqlite 為資料庫使用, 執行 migration rollback 的時候發生下列錯誤訊息:
SQLite doesn't support multiple calls to dropColumn / renameColumn in a
single modification.
### 發生原因
在 migration 的 down() 方法裡使用多個 dropColumn 但 Sqlite 不支援
$table->dropColumn('field1');
$table->dropColumn('field2');
### 解決方法
用 array() 方式來改寫 dropColumn 即可
$table->dropColumn([
'field1',
'field2',
]);
### 參考連結
- [Database: Migrations -- Dropping Columns](https://laravel.com/docs/7.x/migrations#dropping-columns)
2020/05/06
[CSS] 列印網頁強制換頁設定
markdown
### 換頁的 CSS 相關設定
```css
page-break-before: auto|always|avoid|left|right|initial|inherit;
page-break-after: auto|always|avoid|left|right|initial|inherit;
page-break-inside: auto|avoid|initial|inherit;
```
在標籤前或後換頁
```css
@media print {
/* 在標籤前換頁 */
h1 { page-break-before: always; }
/* 在標籤後換頁 */
footer { page-break-after: always; }
}
```
避免在文中換頁 `page-break-inside: avoid;`
```css
@media print {
/* 避免標籤內換頁 */
pre, blockquote { page-break-inside: avoid; }
}
```
### References
- https://www.w3schools.com/cssref/pr_print_pageba.asp
2020/04/10
[EF] 使用 SqlFunctions.DatePart 解決 DataTime 日期格式化問題
markdown
### 環境
- Entity Framework 6
### 問題
在 EF 要處理日期時間的特定格式,不能用 DateTime.ToString() 的方式來處理
例如:
```
var orders = context.Orders.Where(x => x.OrderDate.ToString("yyyy-MM").Equals("2020-04")).ToList();
```
執行會出現錯誤
```
System.NotSupportedException: LINQ to Entities does not recognize the method 'System.String ToString(System.String)' method, and this method cannot be translated into a store expression.
```
因為 ToString() 是 C# 程式語法, SQL 不認識它是正常的
### 解決方法
透用 [DbFunctions](https://docs.microsoft.com/en-us/dotnet/api/system.data.entity.dbfunctions?view=entity-framework-6.2.0&WT.mc_id=DOP-MVP-5002629) 或 [SqlFunctions](https://docs.microsoft.com/en-us/dotnet/api/system.data.entity.sqlserver.sqlfunctions?view=entity-framework-6.2.0&WT.mc_id=DOP-MVP-5002629) 來處理日期格式問題
以下是採用 SqlFunctions.DatePart() 來取得我要的日期部分
```
var orders = db.Orders.Where(x =>
SqlFunctions.DatePart("year", x.OrderDate) == 2020
&& SqlFunctions.DatePart("month", x.OrderDate) == 4
).ToList();
```
常用的 datepart 參數: `year`, `month`, `day`, `week`, `hour`, `minute`
詳細的 DatePart 可以查詢 [SQL 文件: DATEPART](https://docs.microsoft.com/zh-tw/sql/t-sql/functions/datepart-transact-sql?view=sql-server-ver15&WT.mc_id=DOP-MVP-5002629)
### 參考連結
- [DbFunctions](https://docs.microsoft.com/en-us/dotnet/api/system.data.entity.dbfunctions?view=entity-framework-6.2.0&WT.mc_id=DOP-MVP-5002629)
- [SqlFunctions](https://docs.microsoft.com/en-us/dotnet/api/system.data.entity.sqlserver.sqlfunctions?view=entity-framework-6.2.0&WT.mc_id=DOP-MVP-5002629)
- [SqlFunctions.DatePart Method](https://docs.microsoft.com/en-us/dotnet/api/system.data.entity.sqlserver.sqlfunctions.datepart?view=entity-framework-6.2.0&WT.mc_id=DOP-MVP-5002629)
- [SQL 文件 DATEPART](https://docs.microsoft.com/zh-tw/sql/t-sql/functions/datepart-transact-sql?view=sql-server-ver15&WT.mc_id=DOP-MVP-5002629)
- [Linq Convert DateTime? to DateTime in ("dd/MM/yyyy")](https://forums.asp.net/t/1854597.aspx)
- [EF DateTime格式化](https://xbuba.com/questions/51970339)
2020/03/31
[Vue] 如何轉換 jQuery 全域的 click 事件到 Vue 的相對處理方試
markdown
### 前言
採用 jQuery 引用 `$(document).click()` 的來監聽整份文件的點擊事件
文件內有其他子項目的點擊處理 `$('.myButton').click()`
那麼以 Vue 的相對處理方式為何? (範例為 Vue 2.x 版本)
### 監聽事件
在 mounted 加入 `document.addEventListener`, 事件為 `click`, callback 為在 Vue 的定義的 `onClick` 方法
```
document.addEventListener('click', this.onClick);
```
在 Vue 的使用如下
```js
new Vue({
...
methods: {
onClick() {},
buttonClick() {}
}
mounted() {
document.addEventListener('click', this.onClick);
},
beforeDestroy() {
document.removeEventListener('click', this.onClick);
},
...
});
```
注意在 HTML 的 Vue click 事件, 需要加上 `.stop` (它等同於 `event.stopPropagation()`)
這會防止觸發它以外的事件
```html
```
Vue 的 Event Modifiers 除了常用的 `.prevent` (等同於 `event.preventDefault()`) 及上面提及的 `.stop` 之外
還有 `.capture`, `.self`, `.once`, `.passive` 等事件修飾符
詳細文件可以參考 [Event Handling](https://vuejs.org/v2/guide/events.html)
### 參考連結
- [Vue.js + Call the click event for whole page document](https://stackoverflow.com/questions/41950432/vue-js-call-the-click-event-for-whole-page-document)
- [Vue.js: Methods 與事件處理 (Event Handling)](https://cythilya.github.io/2017/04/17/vue-methods-and-event-handling/)
- [Vue - Event Handling](https://vuejs.org/v2/guide/events.html)
2020/03/16
[TypeScript] 解決 TS2300: Duplicate identifier 'IteratorResult' 錯誤問題
markdown
今天在做 VS Code 套件編譯時出現以下錯誤訊息: `Duplicate identifier 'IteratorResult'`
有 2 個 *.d.ts 檔案定義相沖突
```
Starting compilation in watch mode...
../../../npm/node_modules/typescript/lib/lib.es2015.iterable.d.ts:41:6 - error TS2300: Duplicate identifier 'IteratorResult'.
41 type IteratorResult = IteratorYieldResult | IteratorReturnResult;
~~~~~~~~~~~~~~
node_modules/@types/node/index.d.ts:74:11
74 interface IteratorResult { }
~~~~~~~~~~~~~~
'IteratorResult' was also declared here.
node_modules/@types/node/index.d.ts:74:11 - error TS2300: Duplicate identifier 'IteratorResult'.
74 interface IteratorResult { }
~~~~~~~~~~~~~~
../../../npm/node_modules/typescript/lib/lib.es2015.iterable.d.ts:41:6
41 type IteratorResult = IteratorYieldResult | IteratorReturnResult;
~~~~~~~~~~~~~~
'IteratorResult' was also declared here.
Found 2 errors. Watching for file changes.
```
### 解決方法
在 `tsconfig.json` 的 `compilerOptions` 區塊加上以下設定, 再重新執行編譯
透過直接跳過 Library 的檢查, 因為它不在我程式碼的控制範圍內, 把它排除即可
```
"skipLibCheck": true,
```
2020/01/30
[.NET Core] 在本地使用 Try .NET
markdown
### 前言
微軟有個很棒的線上執行 .NET 程式的平台 Try .NET,可以到這裡試玩學習 [.NET In-Browser Tutorial](https://dotnet.microsoft.com/learn/dotnet/in-browser-tutorial/1)
而這個 Try .NET 我們也可以下載在本地端使用唷!自己創建 Sample Code 做為教育訓練用也不錯~
### 環境
- Windows 10
- .NET Core 3.1
### 本地使用 Try .NET
安裝文件 [Getting started with dotnet try](https://github.com/dotnet/try/blob/master/DotNetTryLocal.md)
首先需要 .NET Core 2.1 或 3.0 以上 SDK 版本,才能進行以下步驟
#### 安裝 dotnet-try 全域工具
```
dotnet tool update -g dotnet-try
```
#### 開始玩 samples 官方提供 3 種方式,本範例採用第一種最簡單的開始方式,直接使用工具的預設範例 先建立一個新的資料夾,切換至此資料夾位置輸入以下指令 ``` dotnet try demo ```
#### Try .NET demo project 開啟的專案畫面如下,裡面包含使用說明及教學
#### 常用指令 用來驗證執行的 sample code 是否能正確執行 ``` dotnet try verify ``` 有趣嗎?快載來玩玩吧! ### References: - [Try .NET](https://github.com/dotnet/try) - [Try .NET Samples](https://github.com/dotnet/try-samples)

#### 開始玩 samples 官方提供 3 種方式,本範例採用第一種最簡單的開始方式,直接使用工具的預設範例 先建立一個新的資料夾,切換至此資料夾位置輸入以下指令 ``` dotnet try demo ```

#### Try .NET demo project 開啟的專案畫面如下,裡面包含使用說明及教學

#### 常用指令 用來驗證執行的 sample code 是否能正確執行 ``` dotnet try verify ``` 有趣嗎?快載來玩玩吧! ### References: - [Try .NET](https://github.com/dotnet/try) - [Try .NET Samples](https://github.com/dotnet/try-samples)
訂閱:
文章 (Atom)