Question

我正在使用带有awesome-typescript-loader和Webpack的Typescript进行编译。但是在IE11中，它不起作用。我有这个错误。

SCRIPT1014

bundle.js（58458,12）

在这一行中，我有这个。我认为问题出在字符'

const v6 =`

这是我对tsconfig.json的配置

{
  "compilerOptions": {
    "target": "es6",
    "module": "es6",
    "moduleResolution": "node",
    "resolveJsonModule": true,
    "declaration": false,
    "esModuleInterop": true,
    "noImplicitAny": false,
    "jsx": "react",
    "sourceMap": true,
    "noLib": false,
    "suppressImplicitAnyIndexErrors": true,
    "baseUrl": "./src/",
    "paths": {
      "@pages": ["./pages/*"],
      "@core": ["./core/*"],
      "@pods": ["./pods/*"],
      "@common": ["./common/*"],
      "@state": ["./state/*"]
    },
    "skipLibCheck": true
  },
  "compileOnSave": false,
  "exclude": ["node_modules"]
}

这是我的webpack.config.js

    var HtmlWebpackPlugin = require("html-webpack-plugin");
var MiniCssExtractPlugin = require("mini-css-extract-plugin");
var webpack = require("webpack");
var path = require("path");

var basePath = __dirname;

module.exports = {
  context: path.join(basePath, "src"),
  resolve: {
    extensions: [".js", ".ts", ".tsx"],
    alias: {
      // Later on we will add more aliases here
      pages: path.resolve(__dirname, "./src/pages/"),
      core: path.resolve(__dirname, "./src/core/"),
      pods: path.resolve(__dirname, "./src/pods/"),
      common: path.resolve(__dirname, "./src/common/"),
      state: path.resolve(__dirname, "./src/state/"),
    }
  },
  entry: ["@babel/polyfill", "./index.tsx"],
  output: {
    path: path.join(basePath, "dist"),
    filename: "bundle.js"
  },
  devtool: "source-map",
  devServer: {
    contentBase: "./dist", // Content base
    inline: true, // Enable watch and live reload
    host: "test",
    port: 8080,
    stats: "errors-only",
    disableHostCheck: true,
    historyApiFallback: true,
  },
  module: {
    rules: [
      {
        test: /\.(ts|tsx)$/,
        exclude: /node_modules/,
        loader: "awesome-typescript-loader",
        options: {
          useBabel: true,
          babelCore: "@babel/core" // needed for Babel v7
        }
      },
      {
        test: /\.css$/,
        use: [MiniCssExtractPlugin.loader, "css-loader"]
      },
      {
        test: /\.(png|jpg|gif|svg)$/,
        loader: "file-loader",
        options: {
          name: "assets/img/[name].[ext]?[hash]"
        }
      }
    ]
  },
  plugins: [
    //Generate index.html in /dist => https://github.com/ampedandwired/html-webpack-plugin
    new HtmlWebpackPlugin({
      filename: "index.html", //Name of file in ./dist/
      template: "index.html", //Name of template in ./src
      hash: true
    }),
    new MiniCssExtractPlugin({
      filename: "[name].css",
      chunkFilename: "[id].css"
    })
  ]
};

然后是.babelrc文件

{
  "presets": [
    [
      "@babel/preset-env",
      {
        "useBuiltIns": "entry"
      }
    ]
  ]
}

关于这个问题，我没有更多的想法。

Answer 1

请检查该字符，也许您正在使用中文符号字符“`”。尝试将其更改为英文字符“''。

Answer 2

IE 11不支持模板文字。模板文字是es6语法，因此我建议您在tsconfig中使用es5目标

如果不确定每个浏览器可以使用什么，请检查here

bundle.js中的IE11错误（由无效字符引起）

2 个答案: