目次
序文：
サーバーには nginx、jenkisn、npm がデプロイされており、これに基づいてフロントエンド プロジェクトがデプロイされます。
後続の追加関連の nginx およびその他のサーバーのインストール操作。
1. Jenkins 設定パラメータ
1. 新しいソフトウェア項目を追加します
2. プロジェクトの説明を追加する
3. 履歴画像処理ルールを構成する
例: ビルド タスクは最大 30 日間予約され、最大 10 個のビルド タスクが予約されます。
4. ターゲットサーバーを構築するためのプロジェクトを構成します。
5. フロントエンドコードアドレスと構築するブランチを設定します
6. フロントエンドコードの保存場所を構成する
7. フロントエンドのコンパイル済みコードのスクリプト パスを構成します。
一時変数を構成し、ターゲット パスでスクリプトを実行してフロントエンド コードをコンパイルします。
2. フロントエンドコードスクリプトを構築する
#!/bin/bash
#1打包前端
echo "package demoWeb..."
#前端代码存放地
cd /app/autopackage/demo/dev/code/demo
#借助npm实现拉取、构建等
export nodejieba_binary_host_mirror=http://前端部署服务器ip/npm/nodejieba/
#信任非http连接,配置node所在路径
NODE_DIR=/app/autopackage/pck_env/node14/bin
#清楚缓存
$NODE_DIR/npm cache clean --force
$NODE_DIR/node $$NODE_DIR/npm config set unsafe-perm=true
$NODE_DIR/node $NODE_DIR/npm fund
$NODE_DIR/node $NODE_DIR/npm run build
echo "package demoWeb...end"
3. 追加の補足関連構成
1. ビルドが失敗するか、ノード関連の問題が発生する場合は、コードの場所でnode_modulesを構成できます。
2.npm構成パスを確認します。
npm config プレフィックスを取得
3. ノードの npm バージョンを表示する
ノード -v
npm -v
4. ノードモジュールのパスを見つける
npm root -g
npm bin -g
5. ノードのアップグレード
npm install -g -n
またはインストールする
npmインストール
6. nginx は、コードをコンパイルするために対応するポート番号マッピングを設定します。
主に新しいnginxファイルを追加します
主な構成サーバーは次のとおりです。
サーバ{
listen 9091;#外部アクセスポート
サーバー名 ローカルホスト；
位置 /{
root /app/autopackage/demp/code/demo/dist/project; #フロントエンドでコンパイルされたコードの場所
インデックスindex.html;#フロントエンドホームページ
try_files $uri $url/ /app/autopackage/demp/code/demo/dist/project/index.html;# エラー ページ 404 が見つからないため、この構成を読み込むことができません
}
}
nginx の設定 に関する記事を参照してください。