Question

我正在研究一个反应应用程序。我在哪里使用webpack和babel装载机。在我的反应应用程序中，我多次使用import语句，这是正常的。

现在我有另一个独立的应用程序，工作正常。现在我使用npm在react应用程序中安装我的独立应用程序。所以我做了

let standAloneApplication =  require("my_stand_alone_application")

但我在standAloneApplication中遇到导入错误。我有一条线 import controller from "./controller" // Main.js:1Uncaught SyntaxError:意外的令牌导入

其中React应用程序中的import语句正常工作。独立应用也可以单独使用。但它在一起它给出了SyntaxError

我的网络包文件

var webpack = require('webpack');
var path = require('path');

var BUILD_DIR = path.resolve(__dirname, 'html');
var APP_DIR = path.resolve(__dirname, 'html');

var config = {
  entry: APP_DIR + '/app.js',
  output: {
    path: BUILD_DIR,
    filename: 'bundle.js'
  },
   devtool: "source-map",
   node: {
     fs: "empty"
   } ,
      module : {
    loaders : [
      {
        test : /\.js?/,
        include : APP_DIR,
        exclude: /node_modules/,
        loaders: ['babel?presets[]=react,presets[]=es2015,plugins[]=transform-decorators-legacy,plugins[]=transform-class-properties,plugins[]=transform-export-extensions'],
      },

      { test: /\.json$/, loader: "json" }
    ]
  }
}

module.exports = config;

main.js来自独立应用程序的代码

import {Controller} from "./Controller/index.js"

export class Main () {

}

Answer 1

请注意加载程序设置中的exclude: /node_modules/。

由于您使用npm安装了应用/模块，因此它位于该目录中，并且由于排除，因此Babel不会对其进行转换。

也许，但我不确定，您可以将其明确添加到include行：

include : [
  APP_DIR,
  path.resolve(__dirname, 'node_modules/my_stand_alone_application')
]

Uncaught SyntaxError：`意外的令牌导入

1 个答案: