.net core mvc初級教程(三)

1、更正popper.js的錯誤
2、打包js
3、添加服務與路由,中間件css

1、更正popper.js的錯誤

emmm,今天來更正些昨天的錯誤
那個package.json裏面的popper改成"popper.js": 「1.14.6」,後面的版本也改下,而後點擊保存node

{
  "version": "1.0.0",
  "name": "asp.net",
  "private": true,
  "devDependencies": {
    "bootstrap": "4.2.1",
    "jquery-slim": "3.0.0",
    "popper.js": "1.14.6"
  }
}

在這裏插入圖片描述

2、打包js

在wwwroot/js文件夾下添加site.js
而後打開bundleconfig.json進行js打包操做jquery

[
  {
    "outputFileName": "wwwroot/css/all.min.css",
    "inputFiles": [
      "node_modules/bootstrap/dist/css/bootstrap.css",
      "wwwroot/css/site.css"
    ]
  },
  //上面用於開發
  //下面用於生產
  {
    "outputFileName": "wwwroot/css/bootstrap.css",
    "inputFiles": [
      "node_modules/bootstrap/dist/css/bootstrap.css"
    ],
    "minify": {
      "enabled": false //意爲沒有對它進行壓縮
    }
  },
  //js
  {
    "outputFileName": "wwwroot/js/all.min.js",
    "inputFiles": [
      "node_modules/jquery-slim/dist/jquery.slim.js",
      "node_modules/popper.js/dist/js/popper.js",
      "node_modules/bootstrap/dist/js/bootstrap.js",
      "wwwroot/js/site.js"
    ],
    "minify": {
      "enabled": true,
      "renameLocals": true //true重命名局部變量
    },
    "sourceMap": false //一個存儲源代碼與編譯代碼對應位置映射的信息文件
  },
  {
    "outputFileName": "wwwroot/js/vendor.js",
    "inputFiles": [
      "node_modules/jquery-slim/dist/jquery.slim.js",
      "node_modules/popper.js/dist/js/popper.js",
      "node_modules/bootstrap/dist/js/bootstrap.js"
    ],
    "minify": {
      "enabled": false
    }
  }
]

而後點擊解決方案,店家從新生成
在這裏插入圖片描述
js文件夾就會多出兩個web

3、添加服務與路由,中間件

接下來就是添加服務與中間件了
打開stratup類,在ConfigureServices方法中添加json

services.AddMvc();註冊服務bootstrap

在Configure方法
去掉
app.Run(async (context) =>
{
await context.Response.WriteAsync(「Hello World!」);
});瀏覽器

添加默認路由
app.UseMvc(routes =>
{
//默認路由:沒有指定url和controller狀況下會默認找到下面這個
routes.MapRoute(
name: 「default」,
template: 「{controller=Home}/{action=Index}/{id?}」);
});app

打開launchSettings.json,把這個去掉,可直接打開控制檯
在這裏插入圖片描述
在這裏插入圖片描述
在這裏插入圖片描述asp.net

打開瀏覽器輸入localhost:5000async

卻發現什麼都沒

而後在Configure方法添加

//顯示錯誤
app.UseStatusCodePages();

//加載wwwroot文件夾下css,js
app.UseStaticFiles()

這兩個方法,做用都備註了;

再運行,輸入網址
在這裏插入圖片描述
這個是默認顯示的錯誤

還能夠本身添加自定義錯誤輸出
app.UseStatusCodePagesWithRedirects();
這裏就不用了

stratup類代碼

using System;
using System.Collections.Generic;
using System.Linq;
using System.Threading.Tasks;
using DemoCoreStudy.Serivce;
using Microsoft.AspNetCore.Builder;
using Microsoft.AspNetCore.Hosting;
using Microsoft.AspNetCore.Http;
using Microsoft.AspNetCore.Routing;
using Microsoft.Extensions.DependencyInjection;

namespace DemoCoreStudy
{
    public class Startup
    {
        // This method gets called by the runtime. Use this method to add services to the container.
        // For more information on how to configure your application, visit https://go.microsoft.com/fwlink/?LinkID=398940
        public void ConfigureServices(IServiceCollection services)
        {
            services.AddMvc();

            services.AddSingleton<ICinemaService, CinemaMemoryService>();
            services.AddSingleton<IMovieService, MovieMemoryService>();
        }

        // This method gets called by the runtime. Use this method to configure the HTTP request pipeline.
        public void Configure(IApplicationBuilder app, IHostingEnvironment env)
        {
            if (env.IsDevelopment())
            {
                app.UseDeveloperExceptionPage();
            }

            //顯示錯誤
            //app.UseStatusCodePages();

            //添加自定義錯誤
            //app.UseStatusCodePagesWithRedirects();

            //加載wwwroot文件夾下css,js
            app.UseStaticFiles();

            app.UseMvc(routes =>
                {
                    //默認路由:沒有指定url和controller狀況下會默認找到下面這個
                    routes.MapRoute(
                        name: "default", 
                        template: "{controller=Home}/{action=Index}/{id?}");
                });
        }
    }
}

下一篇博客
https://blog.csdn.net/qq_41841878/article/details/85496219

相關文章
相關標籤/搜索