javascript - Uncaught SyntaxError :意外 token )不确定我在做什么错？

我正在尝试设置一个javascript（Es6 +）项目，我已经使用Babel设置了Webpack，它似乎正在将我的代码转换为Es5，但是由于某些原因，Import语句无法按需工作。在构建期间，一切都不会失败，但是在运行应用程序时，它会打印此错误，捆绑的输出似乎略有偏离

index.js:14 Uncaught SyntaxError: Unexpected token )
    at Object../src/index.js (soem.2a9b32189bc67cc82c15.js:1189)
    at __webpack_require__ (soem.2a9b32189bc67cc82c15.js:727)
    at fn (soem.2a9b32189bc67cc82c15.js:101)
    at Object.0 (soem.2a9b32189bc67cc82c15.js:1225)
    at __webpack_require__ (soem.2a9b32189bc67cc82c15.js:727)
    at soem.2a9b32189bc67cc82c15.js:794
    at soem.2a9b32189bc67cc82c15.js:797

捆绑输出

__webpack_require__.r(__webpack_exports__);
/* harmony import */ var _someModule_js__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./someModule.js */ "./src/someModule.js");
/* harmony import */ var _styles_scss_main_scss__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./styles/scss/main.scss */ "./src/styles/scss/main.scss");
/* harmony import */ var _styles_scss_main_scss__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(_styles_scss_main_scss__WEBPACK_IMPORTED_MODULE_1__);
// const { dk } = require('./otherModule.js');


var tt = 'hdh';
var tk = {
  tt: 'hdhd',
  replace: '""'
};
dkk();
soObject(_someModule_js__WEBPACK_IMPORTED_MODULE_0__["dkk"])); /Object(_someModule_js__WEBPACK_IMPORTED_MODULE_0__["some"])nsole.log(`jdjdjdj ${tt} ${tk}`);//# sourceURL=[module]

[“ dkk”]之后有一个额外的结束括号

package.json

{
  "name": "sdk-v10-web",
  "version": "10.0.9",
  "description": "",
  "main": "index.js",
  "scripts": {
    "start": "webpack-dev-server --config build-utils/webpack.config.js --env.env=dev --hot",
    "build": "npm version patch && webpack --config build-utils/webpack.config.js --env.env=prod",
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "author": "",
  "license": "ISC",
  "devDependencies": {
    "@babel/core": "^7.5.5",
    "@babel/preset-env": "^7.5.5",
    "autoprefixer": "^9.6.1",
    "babel-loader": "^8.0.6",
    "clean-webpack-plugin": "^3.0.0",
    "css-loader": "^3.2.0",
    "dotenv-webpack": "^1.7.0",
    "html-webpack-plugin": "^3.2.0",
    "mini-css-extract-plugin": "^0.8.0",
    "node-sass": "^4.12.0",
    "postcss-loader": "^3.0.0",
    "sass-loader": "^7.3.1",
    "style-loader": "^1.0.0",
    "webpack": "^4.39.2",
    "webpack-cli": "^3.3.7",
    "webpack-dev-server": "^3.8.0",
    "webpack-merge": "^4.2.1",
    "webpack-plugin-replace": "^1.2.0"
  },
  "browserslist": [
    "last 10 version",
    "> 1%",
    "not ie < 8"
  ]
}

webpack.common.js

const path = require('path');
const { CleanWebpackPlugin } = require('clean-webpack-plugin');
const HtmlWebpackPlugin = require('html-webpack-plugin');
const MiniCssExtractPlugin = require('mini-css-extract-plugin');
const ReplacePlugin = require('webpack-plugin-replace');
const fs = require("fs");

const REPLACEABLES = {
  PROMPT_TEMPLATE: ''//fs.readFileSync(path.join(__dirname, '../src') + '/prompt-templates/master-template.html', "utf8"),
}

module.exports = {
  entry: './src/index.js',
  module: {
    rules: [
        {
            test: /\.(js)$/,
            exclude: /node_modules/,
            use: {
              loader: 'babel-loader',
              options: {
                presets: ['@babel/preset-env']
              }
            }
        },
        {
            test: [/.css$|.scss$/],
            use: [
                MiniCssExtractPlugin.loader,
                // 'style-loader',
                'css-loader',
                'sass-loader',
                'postcss-loader'
            ]
        },
    ]
  },
  resolve: {
    extensions: ['*', '.js']
    // alias: {
    //   // Utilities: path.resolve(__dirname, 'src/utilities/'),
    //   // Templates: path.resolve(__dirname, 'src/templates/')
    // }
  },
  plugins: [
    new CleanWebpackPlugin(),
    new HtmlWebpackPlugin({
      template: './src/index.html'
    }),
    new MiniCssExtractPlugin({
        filename: 'hansel.[contenthash].css'
    }),
    new ReplacePlugin({
      exclude: [
        /node_modules/,
        /build-utils/,
        /dist/,
      ],
      values: {
        '%%REPLACE%%': JSON.stringify(REPLACEABLES.PROMPT_TEMPLATE)
      }
    }),
  ],
  output: {
    path: path.resolve(__dirname, '../', 'dist'),
    publicPath: '/',
    filename: 'soem.[hash].js'
  },
  devServer: {
    contentBase: './dist',
    host: "localhost.soem.io",
    open: true,
    port: 8080,
    // https: true,
  },
};

webpack.dev.js

const { DefinePlugin } = require('webpack');
const Dotenv = require('dotenv-webpack');

module.exports = {
  mode: 'development',
  devtool: 'eval-source-map',
  plugins: [
    new DefinePlugin({
      'process.env': {    // console.log(process.env.NODE_ENV); in source code
        'NODE_ENV': JSON.stringify('development'),
      }
    }),
    new Dotenv({
      path: './.env.development',
    }),
  ],
};

webpack.prod.js

const { DefinePlugin } = require('webpack');
const Dotenv = require('dotenv-webpack');

module.exports = {
  mode: 'production',
  devtool: 'source-map',
  plugins: [
    new DefinePlugin({
      'process.env': {  // console.log(process.env.NODE_ENV); in source code
        'NODE_ENV': JSON.stringify('production'),
      }
    }),
    new Dotenv({
      path: './.env.production',
    }),
  ],
};

webpack.config.js

const webpackMerge = require('webpack-merge');

const commonConfig = require('./webpack.common.js');

module.exports = ({ env }) => {
  const envConfig = require(`./webpack.${env}.js`);

  return webpackMerge(commonConfig, envConfig);
};

someModule.js

export function some() {
    // function someMethod() {
    //     console.log('someMethod');
    // }
    console.log('fsf');
}

export function dkk() {
    // function otherMethod() {
    //     console.log('otherMethod')
    // }
    console.log('hshs');
    return 'tt';
}
// some();

// export default some;

index.js

// const { dk } = require('./otherModule.js');
import {some, dkk } from './someModule.js';
import './styles/scss/main.scss';

const tt = 'hdh';
const tk = {
    tt: 'hdhd',
    replace: '%%REPLACE%%',
}
dkk();
some();

console.log(`jdjdjdj ${tt} ${tk}`);

最佳答案

问题是webpack-plugin-replace插件，由于某种原因，它破坏了输出，使用string-replace-loader代替了工作