Laravel Mix Transpile依赖 [英] Laravel mix transpile dependency

问题描述

我正在尝试在laravel mix项目(使用打字稿).但是我一直收到错误 Uncaught TypeError:如果没有'new'，则无法调用类构造函数VuexModule .这似乎是已知问题，可以通过添加 transpileDependencies:['vuex-module-decorators'] 到我的 vue.config.js 文件中，该文件将告诉babel打包该软件包.

I'm trying to use the vuex-module-decorators library in a laravel mix project (using typescript). But I keep getting the error Uncaught TypeError: Class constructor VuexModule cannot be invoked without 'new'. This seems to be a known issue and can be resolved by adding transpileDependencies: ['vuex-module-decorators'] to my vue.config.js file which will tell babel to transpile the package.

由于我使用的是laravel mix，因此添加 vue.config.js 文件不会执行任何操作.而且我不知道如何告诉laravel mix转换 vuex-module-decorators 依赖项.

Since I'm using laravel mix, adding a vue.config.js file doesn't do anything. And I can't figure out how to tell laravel mix to transpile the vuex-module-decorators dependency.

我尝试将 {测试:/\.js $/，加载程序:['babel-loader']}，添加到 webpack.mix.js (还明确包含了依赖项)，但是它不起作用.

I tried adding { test: /\.js$/, loaders: ['babel-loader'] }, to the webpack config in webpack.mix.js (also with explicitly including the dependency) but it doesn't work.

那么我如何告诉laravel mix转换vuex-module-decorators依赖关系(到es5)?

So how can I tell laravel mix to transpile the vuex-module-decorators dependency (to es5)?

如果有帮助，这是我的 webpack.mix.js 文件:

If it helps, here's my webpack.mix.js file:

mix
  .ts('resources/ts/app.ts', 'public/js')
  .stylus('resources/stylus/app.styl', 'public/css');

推荐答案

我能够将 babel-loader 指向所有 .js 文件，并且有效:

I was able to point babel-loader at all .js files and that worked:

// In webpack.mix.js
mix.webpackConfig({
   module: {
     rules: [{
       test: /\.js?$/,
       use: [{
         loader: 'babel-loader',
         options: mix.config.babel()
       }]
     }]
   }
 });

但是，如果使用更具体的 test 仅定位需要转换的模块，则可以减少编译时间:

However your compile times will be reduced if use a more specific test to target only the modules you need to transpile:

    test: /node_modules\/(vuex-module-decorators|vuex-persist)\/.+\.js$/,

这篇关于Laravel Mix Transpile依赖的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！