TypeScript下的webpack配置

build->webpack.config.js

const merge = require('webpack-merge')
const baseConfig = require('./webpack.base.config')
const devConfig = require('./webpack.dev.config')
const proConfig = require('./webpack.pro.config')
module.exports = (env, argv) => {
  let config = argv.mode === 'development' ? devConfig : proConfig;
  return merge(baseConfig, config);
}

build->webpack.base.config.js

const HtmlWebpackPlugin = require('html-webpack-plugin')
module.exports = {
  entry: './src/index.ts',
  output: {
    filename: 'app.js'
  },
  resolve: {
    extensions: ['.js', '.ts', '.tsx']
  },
  module: {
    rules: [
      {
        test: /\.tsx?$/i,
        use: [{
          loader: 'ts-loader'
        }],
        exclude: /node_modules/
      }
    ]
  },
  stats: {
    entrypoints: false,
    children: false
  },
  plugins: [
    new HtmlWebpackPlugin({
      template: './src/tpl/index.html'
    })
  ]
}

build->webpack.dev.config.js

module.exports = {
  devtool: 'cheap-module-eval-source-map'
}

build->webpack.production.config.js

const { CleanWebpackPlugin } = require('clean-webpack-plugin')
module.exports = {
  plugins: [
    new CleanWebpackPlugin()
  ]
}

package.json

"main": "./src/index.ts",
"scripts": {
  "start": "webpack-dev-server --mode=development --config ./build/webpack.config.js",
  "build": "webpack --mode=production --config ./build/webpack.config.js",
  "test": "echo \"Error: no test specified\" && exit 1"
}

安装所需依赖

"devDependencies": {
  "@types/node": "^12.12.54",
  "clean-webpack-plugin": "^3.0.0",
  "html-webpack-plugin": "^3.2.0",
  "ts-loader": "^6.0.2",
  "typescript": "^3.5.1",
  "webpack": "^4.32.2",
  "webpack-cli": "^3.3.2",
  "webpack-dev-server": "^3.5.1",
  "webpack-merge": "^4.2.1"
}

解决运行npm start 报错：Child html-webpack-plugin for “index.html”: 1 asset Entrypoint undefined = index.html

webpack.base.config.js中配置

stats: {
  entrypoints: false,
  children: false
}

解决运行npm start 报错：

ERROR in node_modules@types\node\assert.d.ts[tsl]
ERROR in node_modules@types\node\assert.d.ts(734,51)
TS1144: ‘{’ or ‘;’ expected.

• 安装 @types/node@12.12.54 版本冻结