在本文中，我們將研究創建一個新的 Angular 18 應用程式。
Angular 文件建議全域安裝 ng：
angular.dev/tools/cli/setup-local#install-the-angular-cli
sudo npm install -g @angular/cli
執行指令後：
ng new buy-and-fly
值得注意的是，這並沒有明顯的必要。您可以從應用程式本身使用 ng，您需要在啟動之前新增yarn(npm)。
要建立一個項目，只需 npx 就足夠了。
npx -p @angular/cli ng new buy-and-fly
沒有全域 CLI，一切都是一樣的。
產生了以下檔案：
buy-and-fly ├── angular.json ├── package.json ├── package-lock.json ├── public │ └── favicon.ico ├── README.md ├── server.ts ├── src │ ├── app │ │ ├── app.component.html │ │ ├── app.component.scss │ │ ├── app.component.spec.ts │ │ ├── app.component.ts │ │ ├── app.config.server.ts │ │ ├── app.config.ts │ │ └── app.routes.ts │ ├── index.html │ ├── main.server.ts │ ├── main.ts │ └── styles.scss ├── tsconfig.app.json ├── tsconfig.json └── tsconfig.spec.json
為了方便起見，讓我們建立一個 git 流：
git flow init
如果您沒有 gitflow 軟體包，您可以安全地跳過此步驟。
讓我們創造一個新的早午餐：
git flow feature start config-workspace
然後刪除package-lock.json：
rm package-lock.json
由於我更喜歡紗線，所以讓我們製作預設紗線：
yarn set version stable
更多關於yarn的資訊請造訪官方網站-yarnpkg.com
由於 pnpm 仍然會造成問題，為了簡單起見，我們將使用標準的 nodeLinker：
yarn config set nodeLinker node-modules
刪除 npm 安裝的依賴項：
rm -rf node_modules
為了不用費心選擇在哪裡新增供應商，讓我們將依賴項和 devDependency 結合起來。
結果，我們得到以下package.json：
{
"name": "buy-and-fly",
"version": "0.0.0",
"scripts": {
"ng": "ng",
"start": "ng serve",
"build": "ng build",
"watch": "ng build --watch --configuration development",
"test": "ng test",
"serve:ssr:buy-and-fly": "node dist/buy-and-fly/server/server.mjs"
},
"private": true,
"devDependencies": {
"@angular-devkit/build-angular": "^18.0.5",
"@angular/animations": "^18.0.4",
"@angular/cli": "^18.0.5",
"@angular/common": "^18.0.4",
"@angular/compiler": "^18.0.4",
"@angular/compiler-cli": "^18.0.4",
"@angular/core": "^18.0.4",
"@angular/forms": "^18.0.4",
"@angular/platform-browser": "^18.0.4",
"@angular/platform-browser-dynamic": "^18.0.4",
"@angular/platform-server": "^18.0.4",
"@angular/router": "^18.0.4",
"@angular/ssr": "^18.0.5",
"@types/express": "^4.17.21",
"@types/jasmine": "~5.1.4",
"@types/node": "^20.14.8",
"express": "^4.19.2",
"jasmine-core": "~5.1.2",
"karma": "~6.4.3",
"karma-chrome-launcher": "~3.2.0",
"karma-coverage": "~2.2.1",
"karma-jasmine": "~5.1.0",
"karma-jasmine-html-reporter": "~2.1.0",
"rxjs": "~7.8.1",
"tslib": "^2.6.3",
"typescript": "~5.4.5",
"zone.js": "~0.14.7"
},
"packageManager": "yarn@4.3.1"
}
從儲存庫中排除 .gitignore 中產生的檔案：
# Custom .yarn .angular *.patch .husky/* junit.xml /junit .env package-lock.json yarn.lock .nx src/i18n/source.xlf
安裝依賴項：
yarn
向 git 新增變更：
git add .
提交：
git commit -m “[workspace] Change package manager”
在下一篇文章中，我們將設定 linter 和 IDE。
所有來源都在 github 上的儲存庫 - github.com/Fafnur/buy-and-fly
您可以在這裡觀看示範 - buy-and-fly.fafn.ru/
我的群組：telegram、medium、vk、x.com、linkedin、site
以上是在 Angular 18 中創建應用程式的詳細內容。更多資訊請關注PHP中文網其他相關文章！
