Angular项目配置本地https访问
首先,先创建一个项目
d:\work\learn
λ ng new angular-https
然后cd到刚生成的项目的根目录,建立一个cert目录,用于存放我们的密钥证书等文件
cd angular-https && mkdir cert && cd cert
然后在angular.json文件中添加这行 “ssl”: true
"serve": {
"builder": "@angular-devkit/build-angular:dev-server",
"options": {
"browserTarget": "angular-https:build",
"ssl": true // 添加这行
},
"configurations": {
"production": {
"browserTarget": "angular-https:build:production"
}
}
},
运行npm start,看到open your browser on https://localhost:4200/,配置成功
d:\work\learn\angular-https (master)
λ npm start
> angular-https@0.0.0 start d:\work\learn\angular-https
> ng serve
√ Browser application bundle generation complete.
Initial Chunk Files | Names | Size
vendor.js | vendor | 2.66 MB
polyfills.js | polyfills | 484.59 kB
styles.css, styles.js | styles | 344.16 kB
main.js | main | 59.53 kB
runtime.js | runtime | 6.15 kB
| Initial Total | 3.54 MB
Build at: 2021-02-26T02:09:22.988Z - Hash: cfca81690295ab59c19b - Time: 8255ms
** Angular Live Development Server is listening on localhost:4200, open your browser on https://localhost:4200/ **
√ Compiled successfully.
然后还可以配置虚拟主机,在package.json文件中添加script
"scripts": {
"ng": "ng",
"start": "ng serve",
"host": "ng serve --port=80 --host=domain.com", // 添加这句
...
},
然后配置host文件,我用SwitchHosts快速打开host文件,当然你也可以跑到C:\Windows\System32\drivers\etc去添加指向
再运行npm run host
浏览器打开:https://domain.com:80/
https配置成功啦