如何在没有加载器的情况下获取 javascript 类导入

Question

babel 配置有：

{
  "presets": [
    ["env", { "modules": false }],
    "stage-2"
  ],
  "plugins": ["transform-runtime"],
  "comments": false,
  "env": {
    "test": {
      "presets": ["env", "stage-2"],
      "plugins": [ "istanbul" ]
    }
  }
}

和包装：

"babel-core": "^6.26.0",
"babel-eslint": "^8.2.1",
"babel-helper-vue-jsx-merge-props": "^2.0.3",
"babel-loader": "^7.1.2",
"babel-plugin-istanbul": "^4.1.1",
"babel-plugin-syntax-jsx": "^6.18.0",
"babel-plugin-transform-runtime": "^6.22.0",
"babel-plugin-transform-vue-jsx": "^3.5.0",
"babel-preset-env": "^1.3.2",
"babel-preset-stage-2": "^6.22.0",
"babel-register": "^6.22.0",

在 webpack.conf 中，我有一个（完全有货的）babel-loader 部分：

function resolve (dir) {
  return path.join(__dirname, '..', dir)
}
//...
  {
    test: /\.js$/,
    loader: 'babel-loader',
    include: [resolve('src'), resolve('test'), resolve('node_modules/webpack-dev-server/client')]
  },

但我在加载某些文件时遇到错误，例如：

import Auth from './auth.js'

屈服

 error  in ./fe-common/src/auth.js

Module parse failed: Unexpected token (11:18)
You may need an appropriate loader to handle this file type.
| export default class Auth
| {
|     authenticated = this.isAuthenticated()
|     authNotifier = new EventEmitter()
| 

 @ ./fe-common/src/main.js 19:0-28
 @ ./src/main.js
 @ multi (webpack)-dev-server/client?http://localhost:8080 webpack/hot/dev-server ./src/main.js

每个请求，项目结构：

robertotomas$ tree -d -I node_modules --noreport
.
├── build
├── config
├── fe-common
│   ├── src
│   │   ├── assets
│   │   │   └── images
│   │   ├── components
│   │   ├── css
│   │   ├── router
│   │   └── store
│   └── static
│       ├── images
│       └── jasper
├── fe-styleguide
│   ├── sass
│   │   └── partials
│   │       └── variables
│   └── src
│       ├── assets
│       │   └── images
│       │       ├── font_awesome
│       │       └── rights_owner_types
│       └── components
├── src
│   ├── assets
│   ├── components
│   ├── lang
│   │   └── en
│   ├── router
│   └── store
│       ├── UsageScenarios
│       └── lib
│           └── Schemas
├── static
└── test
    ├── e2e
    │   ├── custom-assertions
    │   └── specs
    └── unit
        └── specs

Answer 1

我认为问题在于您的加载程序的include: 值。 resolve(src) 没有正确搜索文件。

根据您的项目结构，您可能希望在 webpack 配置中使用它

{
  test: /\.js$/,
  loader: 'babel-loader',
  include: [    
    resolve('fe-common/src'),
    resolve('fe-styleguide/src'),
    resolve('src'),
    resolve('test'), 
    resolve('node_modules/webpack-dev-server/client')
  ]
},