Posts
GitLab - Install GitLab Runner on Windows
要在 Windows 使用 GitLab Runner,可至 Install GitLab Runner on Windows - GitLab Documentation 這邊下載 GitLab Runner。
下載後可視需要變更檔名,像是改為 gitlab-runner。然後帶入 install 調用命令,即可進行 GitLab Runner 服務的安裝。
gitlab-runner install GitLab Runner 服務安裝好後,可帶入 start 調用命令,啟動 GitLab Runner 服務。
gitlab-runner start 若不在使用 GitLab Runner,可帶入 stop 調用命令,停用 GitLab Runner 服務。
gitlab-runner stop 然後帶入 uninstall 調用命令,將 GitLab Runner 服務移除。
gitlab-runner uninstall Link GitLab Runner - GitLab Documentation Install GitLab Runner on Windows - GitLab Documentation
read morePosts
Parcel - TypeScript transform
Parcel 支援 TypeScript 的轉換。
像是下面這邊筆者創建了個簡單的範例,建立了個 index.html,裡面引用了 index.ts。
<html> <body> <script src="./index.ts"></script> </body> </html> index.ts 內引用 message.ts,並將 message.ts 傳回的訊息輸出到主控台。
import message from "./message"; console.log(message); message.ts 則是將要顯示的訊息輸出。
export default "Hello, world"; 範例準備好後調用 Parcel 命令建置並啟用服務,Parcel 會自行下載 TypeScript 套件編譯 TypeScript。
Parcel 解析網站後會將需要的檔案處理後移至輸出目錄。
連至啟動的服務網址,可看到網站正確的被運行。
Link 🐠 轉換(Transforms)
read morePosts
SonarQube - Downgrade database
若 SonarQube DB 升級過後想要使用回舊版本的 SonarQube,會發現資料庫已經不相容於舊版本的 SonarQube DB。
這時將 SonarQube DB 刪除後重建。
DROP DATABASE sonar; CREATE DATABASE sonar CHARACTER SET utf8 COLLATE utf8_general_ci; 舊版本的 SonarQube 服務就可以正常運作了。
read morePosts
Parcel - CSS asset
Parcel 支援 CSS 文件的處理,可在 CSS 中透過 @import 載入另一個 CSS。
... @import './background.css'; ... 也可以透過 url 函式引用圖片、字型。
... background-image: url('../images/Profile.jpg'); ... 像是下面這邊筆者創建了個簡單的範例,建立了個 index.html,裡面引用了 index.css。
<html> <head> <link rel="stylesheet" href="./style/index.css"> </head> <body> </body> </html> index.css 內透過 @import 引用了 background.css 檔,用 url 方法使用指定圖片設定背景圖片。
@import './background.css'; body { background-image: url('../images/Profile.jpg'); background-repeat:no-repeat; background-position: center; } background.css 設定背景為指定顏色。
body {background-color: coral;} 範例準備好後調用 Parcel 命令建置並啟用服務。
Parcel 解析網站後會將需要的檔案處理後移至輸出目錄。
連至啟動的服務網址,可看到網站正確的被運行。
Link 📦 資源(Assets)
read morePosts
Parcel - HTML asset
除了 JavaScript 文件外,Parcel 也支援 HTML 文件的處理。
像是下面這邊筆者創建了個簡單的範例,建立了個 index.html,裡面載入了 profile.jpg 且連結了 hello.html 頁面。
<html> <body> <img src="./images/profile.jpg"> <a href="./hello.html">Say Hello</a> </body> </html> profile.jpg 是很單純的大頭照。
hello.html 內引用了 hello.js 並輸出 Hello World 字樣。
<html> <body> <script src="./scripts/hello.js"></script> Hello World </body> </html> hello.js 內則是很簡單的利用 Console 輸出 hello world 字樣。
console.log("hello world"); 調用 Parcel 命令建置並啟用服務。
Parcel 解析網站後會將需要的檔案處理後移至輸出目錄。
連至啟動的服務網址,可看到網站正確的被運行。
Link 📦 資源(Assets)
read morePosts
Parcel - JavaScript asset
要使用 Parcel 在 JavaScript 中載入 JavaScript 模塊可用 CommonJS 的寫法。
const module = require(modulePath); 或是 ES6 的寫法。
import module from modulePath; 除了 JavaScript 的模塊外,也能引用 CSS 文件。
import cssPath; 以及引用圖片。
import imageUrl from imagePath; 像是下面這邊筆者創建了個簡單的範例,建立了個 index.html,裡面引用了 index.js。
<html> <body> <script src="./scripts/index.js"></script> </body> </html> index.js 內引用了不同類型的檔案。
//const hello = require('./hello'); import hello from './hello'; import '../style/index.css'; import profileImageUrl from '../images/profile.jpg'; console.log(profileImageUrl); 像是 js 檔(hello.js)。
console.log("hello world"); CSS 檔(index.css)。
body {background-color: coral;} 以及圖檔。
範例準備好後調用 Parcel 命令建置並啟用服務。
read morePosts
'Parcel - SyntaxError: Unexpected token function'
使用 Parcel 時若發生 SyntaxError: Unexpected token function 錯誤。
這是因為 Parcel 用到了 Node.js 8.x 的語法,確認 Node.js 是否已更新到指定版本,更新完後即可正常運行。
Link 🐛 about SyntaxError: Unexpected token function · Issue #244 · parcel-bundler/parcel · GitHub parcel 錯誤:SyntaxError: Unexpected token function - JJC 前端進階- SegmentFault
read morePosts
Parcel - Getting started
Parcel 使用前需先安裝套件。
可以透過 yarn。
yarn global add parcel-bundler 或是透過 npm 安裝。
npm install -g parcel-bundler 安裝完準備要進行打包的程式。
Index.html 檔案內容為:
<html> <body> <script src="./index.js"></script> </body> </html> Index.js 檔案內容為:
console.log("hello world"); 調用 Parcel 命令進行編譯並運行網站服務。
parcel [WebFile] 編譯後的檔案會產生在 dist 目錄下。
連至網站可看到打包後運行起來的樣子。
要退出網站服務的話,按下熱鍵 Ctrl + C,鍵入 Y 後 Enter 即可。
read morePosts
Parcel - Blazing fast, zero configuration web application bundler
Parcel 是一極速零配置的 Web 應用打包工具,不需額外的配置設定就能快速的將 Web 應用程式進行打包。
該工具具有以下幾個特點:
Blazing fast bundle times Bundle all your assets Automatic transforms Zero config code splitting Hot module replacement Friendly error logging 也就是說 Parcel 的打包速度極快、支援 JS/CSS/HTML 文件、可以自動轉換程式、不用額外的配置、可以動態更新、錯誤訊息比較好看。
其中速度極快是因為 Parcel 使用多核進行編譯,且會將編譯過的文件進行快取,所以編譯速度極快。
Parcel 的作者有在 4 CPU 的 2016 MacBook Pro 上將 1726 的模塊,6.5 M 大小的 Web 應用程式進行壓縮,可以看到 Parcel 在打包上的確花了較少的時間。
Tool Time browserify 22.98s webpack 20.71s parcel 9.98s parcel - with cache 2.64s Link 📦 Parcel
read morePosts
Oracle - v$version table
v$version 資料表主要存放著 Oracle 核心元件的版本資訊,要查閱版本資訊的話可直接查閱該表。
SELECT * FROM v$version; Link V$VERSION Oracle / PLSQL: Retrieve Oracle version information
read more