我拿了这个例子并稍加编辑: https://github.com/globalizejs/globalize/tree/master/examples/app-npm-webpack
我的package.json
{
"private": true,
"devDependencies": {
"cldr-data": "^30.0.4",
"globalize": "^1.2.2",
"globalize-webpack-plugin": "^0.3.10",
"html-webpack-plugin": "^2.28.0",
"webpack": "^2.2.1"
},
"dependencies": {
"react": "^15.4.2"
}
}
我的webpack.config.js
var webpack = require( "webpack" );
var CommonsChunkPlugin = require( "webpack/lib/optimize/CommonsChunkPlugin" );
var HtmlWebpackPlugin = require( "html-webpack-plugin" );
var GlobalizePlugin = require( "globalize-webpack-plugin" );
module.exports = {
entry: {
main: "./src/app.js",
vendor: [
'globalize',
'globalize/dist/globalize-runtime/number',
'globalize/dist/globalize-runtime/currency',
'globalize/dist/globalize-runtime/date',
'globalize/dist/globalize-runtime/message',
'globalize/dist/globalize-runtime/plural',
'globalize/dist/globalize-runtime/relative-time',
'globalize/dist/globalize-runtime/unit'
]
},
output: {
filename: 'bundle.[hash].js',
path: './dist'
},
resolve: {
extensions: [".js"]
},
plugins: [
new HtmlWebpackPlugin({
title: 'test',
filename: 'index.html'
}),
new GlobalizePlugin({
production: true,
developmentLocale: "en",
supportedLocales: [ "en" ],
messages: "messages/[locale].json",
output: "i18n/[locale].[hash].js"
}),
new CommonsChunkPlugin({
name: 'vendor',
filename: 'vendor.[hash].js'
}),
]
};
和我的app.js
var Globalize = require('globalize');
//var react = require('react'); //!!!!!!!!!!!!!!!!!!!!!!!!!!
var f = Globalize.numberFormatter({ maximumFractionDigits: 0, useGrouping: false })
console.log(f(34.4535));
然后我在命令行“webpack”上写了,我的应用程序已经收集了。打开chrome并且应用程序正常运行。但我想记下连接文件的顺序:
但如果我取消注释行var react = require('react');我的应用程序已经收集了,然后当我打开chrome时,我看到以下内容:
你能帮助我吗?
答案 0 :(得分:0)
手动定义订单:
const CHUNK_ORDER = {
"vendor": 1,
"globalize-compiled-data-en": 2,
"main": 3
};
并通过排序功能:
new HtmlWebpackPlugin({
title: 'test',
filename: 'index.html',
chunksSortMode: function(a, b) {
return CHUNK_ORDER[a.names[0]] > CHUNK_ORDER[b.names[0]] ? 1 : -1;
},
}),