VS2015 ASP. NET5 Web project structure analysis, vs2015asp. net5

Source: Internet
Author: User

VS2015 ASP. NET5 Web project structure analysis, vs2015asp. net5

Preface

This personal synchronous blog address http://aehyok.com/Blog/Detail/76.html

After installing VS2015, I always wanted to see how the new version of the Web project was. After the project was built last week, I found it was totally out of sight. Microsoft's update was so fierce. So I had the urge to simply understand the structure of the newly created project. It was really unacceptable. I just wanted to study it, it took about a week before, after, and after that (all of them are amateurs) to get a rough idea. Record it here. Create a Web Project

1. Open VS2015 to create an ASP. NET Web application

2. select ASP. NET 5 Starter Web

3. After creating a project, you can find that the project structure is as follows:

The project structure can be divided into 1 to 6 parts. Next I will briefly describe my understanding of these six parts.

1. global. json

1. The global. json file is stored in the "Solution Items" Solution directory, and the global. json file is opened. This configuration is available by default:

Next we will verify the role of this sources. Download the source code of Asp. Net MVC at https://github.com/aspnet/mvc. Then let's take a look at the downloaded file.

Now, I will simply copy these files to E: \ projects \ Mvc. Return to the global. json file and modify the Code as follows:

{    ////"sources": [ "src", "test" ]    "sources": ["E:\\projects\\Mvc\\src" ]}

Right-click the Solution. The first step is to Clean the Solution, and the second step is to Build the Solution.

After the success, let's take a look at the changes in the files under the solution.

By marking, we can find that the path project set in global. json is loaded in the solution.

If you want to delete these projects, you can first restore the sources value in global. json, manually delete the project under the solution, and then re-compile it.

2. Dependencies (Bower and NPM)

Bower: Bower is an open-source twitter web package (such as bootstrap and jquery) management. Relying on more and more open-source web (html + css + js) projects on github, bower can be managed in the bower mode by adding a configuration file to the github project. Bower allows you to add, upgrade, delete, publish, and manage the dependencies of web packages. You only need to run commands to easily manage the dependencies. You no longer need to download and copy files manually.

Let's take a look at how to use Bower in VS2015. You can first download and install Bower through Nuget.

Then open bower. json.

Enter knoc under "dependencies" and you will find a smart prompt. In the future operation demonstration, we will add the JavaScript library knockout.

However, the class library version is not prompted.

So I went to the official website http://knockoutjs.com/index.htmlto input a token.

"knockout": "^3.2.0"

Next, we will install it through the menu. Locate View ==>> Others Windows ==>> Task Runner Explorer, as shown in

Right-click Tasks ==>> bower and click Run. In this case, check bower. json file, and then add the knockout class library we added to the project.

 

 

 NPM: Npm is a module dependency management tool for Node. js. As a tool used by developers, it mainly solves problems encountered during Node. js development. Like RubyGems's importance to Ruby developers and Maven for Java developers, npm's importance to Node. js developers and communities is self-evident. Now we have transplanted it to Visual Studio, the most invincible development tool in the universe.

The configuration file of NPM in VS2015 is package. json. Next we will add a module: we can find that the smart notification function is also available.

For example, we add the following modules:

"express": "^4.10.2"

Run the command in Task Runner Explorer and you can see it in the NPM folder.

Right-click express and then click Restore Package.

In fact, it is to install the express module.

For the specific use of NPM can refer to the http://www.infoq.com/cn/articles/msh-using-npm-manage-node.js-dependence

3. References

References: References is actually a reference in our previous VS version. You can refer to my reference in VS2010

Unlike earlier versions, only ASP. NET 5.0 and ASP. NET Core 5.0 are available in the VS2015 project directory. All the assemblies are configured and managed through the dependencies node in the project. json file.

 

After the reference is saved, vs2015 automatically downloads the corresponding component from nuget.

4. MVC

Controllers, Models, and Views are no different from our previous ASP. net mvc project. Migrations is a sample project that uses EntityFramework code to migrate files.

5. Seven files

Not in order.

1、Project_Readme.html

This page is a self-reported HTML page for ASP. NET 5. You can link to the content page about ASP. NET 5 through this webpage.

2. Startup. cs should be the original Global. asax. cs.

3. config. json is mainly used to configure the database link string.

4. gruntfile. js is equivalent to a task plug-in manager.

The following is the Grunt task running template.

 

It can be divided into Alias Tasks and Tasks. In alias, grunt. registerTask ("default", ["bower: install"]) is obtained by registering a task in gruntfile.

The task is obtained by grunt. loadNpmTasks ("grunt-contrib-copy"). These packages must be declared in advance through package. json.

Below I simply compress a css file through Grunt.

① Declare the plug-in cssmin in package. json

② Load the plug-in the gruntfile. js File

grunt.loadNpmTasks("grunt-contrib-cssmin");

③ Install the plug-in NPM

④ Refresh in Task Runner Explorer

After refreshing

⑤ Add registration tasks and compressed files in gruntfile. js

6. Refresh the Task Runner Explorer.

Run

View the results after execution

However, the values are slightly different. There is no relationship between them.

Here, we only use Grunt to perform a compression function, and there are many other features that will not be learned here.

6. wwwroot

You may be familiar with wwwroot. Let's see how the website runs.

Right-click the Web Project, select = "Publish, and select File System

Add the application name, select the target path, and click Publish.

Released successfully

Now that the website has been started, it is equivalent to self-carrying the website. Now you can open the website, but you do not know anything. Follow the instructions below

Open http: // localhost: 5000

Summary

Gruntfile. js manages and executes Bower and NPM through Grunt, while Bower manages through bower. json file, and NPM manages through package. json.

Project. json is equivalent to the original configuration file which can manage reference sets and other configurations of projects under References.

Startup. cs is equivalent to the original Global. asax. cs. Config. json mainly defines the connection string of the database.

Some static files are stored in wwwroot. After the Web project is released, use the only dll file AspNet. Loader. dll in the bin directory and the command web. cmd to run the website. The mysteries of this process need further research.

Personal website address: aehyok.com

QQ Technical Group No.: 206058845, verification code: aehyok

Article link: http://www.cnblogs.com/aehyok/p/3946286.html

Thank you for reading this article. If you are interested in the content described in my blog, please make a suggestion. Thank you for your support:-O.

 

Related Article

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.