你说的打包,很简单,就是把网页代码 <head></head>之间的CSS样式代码 ,拿出来 ,放在一个 .css 文件中,然后在 HEAD 中,用<link href="文件名.css" rel="text/css" />
你可以在网页中,打开看一下网站的源代码,就明白了
简单记录下如何使用。首先,如果是使用的ASP.NET MVC4基本或者其他内容更丰富的模板,Bundle应该已经自动配置上了,因为本身会有jQuery和jQuery UI的引用,这两项引用会用到Bundle。
就简单说一下要点吧。
首先在项目的App_Start文件夹中,会有一个BundleConfig.cs文件:
其实有两种方案:第一种是将 css 文件在 js entry 中添加依赖;第二种直接设置 css entry。第一种方案
// index.jsimport 'normalize.css'
...
// webpack config{ entry: {index: './index.js'
},
...
}
// outputindex.jsindex.css
这种是 Webpack 官方推荐的方案,但是每次都要把 css 放到 js entry 中才可以 extract 出来。
第二种方案(直接设置 css entry)
默认 Webpack 设置 css entry 除了 extract 出 css 文件还会多产生一个 js 文件,其实可以写个 Webpack 插件将其删除就可以了。