我正在使用Laravel Mix，它很好地简化了使用WebPack和Babel将高级JS功能向下移植到较旧的浏览器中的能力-除了！ （而且我在这里会发疯）...仅当我将JS转换为他们推荐的目录时，它才对我有用。
推荐的基本“ webpack.mix.js”设置为mix.js(['resources/js/app.js'], 'public/js/app.js');
其中第一个参数可以是单个文件或要转换的文件数组。
默认的resources/js/app.js需要几个标准模块，例如vue，lodash，axios。效果很好。然后在app.js中，我想从vendor/xxxx/assets/js/xx.js那里获取一些其他资源-但出现错误： Unknown plugin "transform-object-rest-spread" specified -这意味着找不到babel插件，这绝对是已安装。路径就是东西。
如果我将xx.js复制到resources/js，然后在app.js中要求它，那就没问题。
我已经使用mix.webpackConfig添加了模块路径vendor/xxxx/assets/js，已经使用了alisas来设置'xx$': path.resolve(__dirname,"vendor/xxxx/assets/js/xx.js"，并且试图在.babelrc中混用babel选项＆webpackConfig选项对象。
下面是最终Webpack配置的一个版本-相信我，我玩过很多变体，我知道这不是一个合适的版本，但是在导入/请求/转换之外的任何文件都无效node_modules（vue）或/resources/js（app.js，也可能需要该目录中的其他文件）。任何想法都很棒！
{ context: 'C:\\www\\Laravels\\lsbb-5-3\\laravel',
entry:
{ '/mixed/js/es6':
[ 'C:\\www\\Laravels\\lsbb-5-3\\laravel\\resources\\js\\app.js',
'C:\\www\\Laravels\\lsbb-5-3\\laravel\\vendor\\xxxx\\js\\xx.js' ] },
output:
{ path: 'C:\\www\\Laravels\\lsbb-5-3\\laravel\\public',
filename: '[name].js',
chunkFilename: '[name].js',
publicPath: '/' },
module:
{ rules:
[ { test: /\.html$/, loaders: [ 'html-loader' ] },
{ test: /(\.(png|jpe?g|gif)$|^((?!font).)*\.svg$)/,
loaders:
[ { loader: 'file-loader',
options: { name: [Function: name], publicPath: '/' } },
{ loader: 'img-loader',
options: { enabled: true, gifsicle: {}, mozjpeg: {}, optipng: {}, svgo: {} } } ] },
{ test: /(\.(woff2?|ttf|eot|otf)$|font.*\.svg$)/,
loader: 'file-loader',
options: { name: [Function: name], publicPath: '/' } },
{ test: /\.(cur|ani)$/,
loader: 'file-loader',
options: { name: '[name].[ext]?[hash]', publicPath: '/' } },
{ test: /\.jsx?$/,
exclude: /(node_modules|bower_components)/,
use:
[ { loader: 'babel-loader',
options:
{ cacheDirectory: true,
presets:
[ [ 'env',
{ modules: false,
targets: { browsers: [ '> 2%' ], uglify: true } } ] ],
plugins:
[ 'transform-object-rest-spread',
[ 'transform-runtime', { polyfill: false, helpers: false } ],
[ 'transform-object-rest-spread' ] ] } } ] },
{ test: /\.css$/, loaders: [ 'style-loader', 'css-loader' ] },
{ test: /\.s[ac]ss$/,
exclude: [],
loaders: [ 'style-loader', 'css-loader', 'sass-loader' ] },
{ test: /\.less$/,
exclude: [],
loaders: [ 'style-loader', 'css-loader', 'less-loader' ] } ] },
plugins:
[ FriendlyErrorsWebpackPlugin {
compilationSuccessInfo: {},
onErrors: undefined,
shouldClearConsole: true,
formatters: [ [Function: format], [Function: format], [Function: format] ],
transformers:
[ [Function: transform],
[Function: transform],
[Function: transform] ] },
DefinePlugin {
definitions: { 'process.env': { NODE_ENV: '"development"' } } },
LoaderOptionsPlugin {
options:
{ minimize: false,
options:
{ context: 'C:\\www\\Laravels\\lsbb-5-3\\laravel\\node_modules\\laravel-mix\\src\\builder',
output: { path: './' } },
test: { test: [Function: test] } } },
ManifestPlugin {},
CustomTasksPlugin {},
BuildCallbackPlugin { callback: [Function] },
{ options:
{ title: 'Laravel Mix',
alwaysNotify: true,
hint: undefined,
contentImage: 'C:\\www\\Laravels\\lsbb-5-3\\laravel\\node_modules\\laravel-mix\\icons\\laravel.png' },
lastBuildSucceeded: false,
isFirstBuild: true } ],
stats:
{ hash: false,
version: false,
timings: false,
children: false,
errorDetails: false,
chunks: false,
modules: false,
reasons: false,
source: false,
publicPath: false },
performance: { hints: false },
devtool: 'eval-source-map',
devServer:
{ headers: { 'Access-Control-Allow-Origin': '*' },
contentBase: 'C:\\www\\Laravels\\lsbb-5-3\\laravel\\public',
historyApiFallback: true,
noInfo: true,
compress: true,
quiet: true },
resolve:
{ extensions: [ '*', '.js', '.jsx', '.vue' ],
alias:
{ 'vue$': 'vue/dist/vue.common.js',
'xx$': 'vendor/xxxx/js/xx.js',
modules:
[ 'node_modules',
'vendor/xxxx/js' ] } }
答案 0 :(得分：0)