这是一个创建于 3444 天前的主题，其中的信息可能已经有所发展或是发生改变。
https://webpack.github.io/docs/code-splitting.html#split-app-and-vendor-code 参考此文的 "Split app and vendor code" , 能把 js 文件分离出来,但 css 无效
我的 webpack 配置
var webpack = require("webpack"); var ExtractTextPlugin = require("extract-text-webpack-plugin"); module.exports = { entry: { app: "./entry.js", vendor: ['bootstrap'], }, output: { path: __dirname + "/dist", filename: "bundle.js" }, module: { loaders: [ { test: /\.less$/, loader: ExtractTextPlugin.extract("style-loader", "css-loader!less-loader")}, { test: /\.css$/, loader: ExtractTextPlugin.extract("style-loader", "css-loader") }, { test: /\.(png|woff|woff2|eot|ttf|svg)$/, loader: 'url-loader?limit=100000' }, ] }, plugins: [ new webpack.optimize.CommonsChunkPlugin(/* chunkName= */"vendor", /* filename= */"vendor.bundle.js"), new ExtractTextPlugin("[name].bundle.css", {allChunks: false}), ] }; 能生成 vendor.bundle.js 文件,且文件内容包含 bootstrap . 但没有生成 vendor.bundle.css 文件. 是 extract-text-webpack-plugin 不支持吗?
想到一种比较笨的办法,就是再建一个 css_entry.js 文件, 在文件里面调用 require('./node_modules/bootstrap/less/bootstrap.less') ,但感觉这个办法有点搓...
有什么更好解决方案的朋友吗?
 | 1 gucheen 2016-05-12 19:38:13 +08:00 via Android  1 因为 npm 包的 main file 是不会包含 CSS ，因此你这样子的写法 CSS 根本不会算是 vendor |
| 2 gucheen 2016-05-12 19:39:17 +08:00 via Android 其实说实话你这样子管理 vendor 还不如写一个 entry |
 | 3 emric 2016-05-12 20:16:22 +08:00  1 ['bootstrap', 'bootstrap/less/bootstrap.less'] |
 | 4 surgit 2016-05-12 20:24:34 +08:00 1 可以 require.ensure 你的 css. 会把 css 压到分离的 js 里面的 |
 | 5 jame 2016-05-12 22:49:54 +08:00 把 style-loader 去掉 |
 | 6 starandtina 2016-05-13 08:59:58 +08:00 via iPhone |
 | 7 cxh116 OP @gucheen 看一下 bootstrap 的 main 文件,确实不会包含 css 文件,谢谢. @emric 这也是种办法,谢谢. @surgit 按需加载看起来更好,谢谢. @jame 去掉无效.谢谢. @starandtina 之前看了,都试了,无效. |
 | 8 poke707 2016-05-13 10:11:32 +08:00 @surgit 我试过 require.ensure 依赖 js 和 css 文件，本来是都 bundle 去一个 chunk 上面去。可是开了 ExtractTextPlugin 之后 css 就去了 extract 出来的那个 css bundle 了（和整个项目的 css 一起）。 是功能限制还是我方式不对吗？ |
Select Language