Question

我在Vue 2.5和VueRouter 3.0中使用laravel 5.7。

我想使用动态模块（see here）。

这是我的.babelrc：

{
    "presets": [
        ["env", {
            "modules": false,
            "targets": {
                "browsers": ["> 1%", "last 2 versions", "not ie <= 8"]
            }
        }],
        "stage-2"
    ],
    "plugins": ["transform-vue-jsx", "transform-runtime","syntax-dynamic-import","dynamic-import-node"],
    "env": {
        "test": {
            "presets": ["env", "stage-2","es2015"],
            "plugins": ["transform-vue-jsx", "transform-es2015-modules-commonjs", "syntax-dynamic-import"]
        }
    }
}

还有我的webpack.mix.js：

const mix = require('laravel-mix');

mix.webpackConfig({
    module: {
        rules: [
            {
                test: /\.styl$/,
                loader: ['style-loader', 'css-loader', 'stylus-loader'],
            }
        ],
    }
});

mix.webpackConfig({
    resolve: {
        alias: {
            "@": path.resolve(
                __dirname,
                "resources/js"
            )
        }
    }
});

mix.js('resources/js/app.js', 'public/js')
   .sass('resources/sass/app.scss', 'public/css');

还有我的路线，具有动态导入功能：

export default [
  {
    path: '/404',
    meta: {
      public: true,
    },
    name: 'NotFound',
    component: () => import(
      /* webpackChunkName: "routes" */
      /* webpackMode: "lazy-once" */
      `@/pages/NotFound.vue`
    )
  },
]

但是当我在应用程序中访问时，找不到我的NotFound模块：

 Error: "Cannot find module 'function () {
        return require('@/pages/NotFound.vue');
      }'."

如果您愿意，我可以提供更多代码或进行解释。

我的目标是将vue-material-admin与Laravel集成。

Answer 1

好的，我的.babelrc错误。

这是正确的文件：

{
    "presets": [
        "stage-2"
    ],
    "plugins": ["transform-vue-jsx", "transform-runtime","syntax-dynamic-import"]
}

我对Webpack和Babel不太满意，所以我接受解释。

在Laravel Mix中使用Vue路由器中的动态导入

1 个答案: