typescript learning(0)

102 阅读1分钟

利用默认参数创建json文件

npm init -y

一项一项定义

npm init

{
  "name": "client-side",
  "version": "1.0.0",
  "description": "source code of ts-learning",
  "main": "./src/index.js",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "repository": {
    "type": "git",
    "url": "git+https://github.com/zhangruxuan/TSpre.git"
  },
  "keywords": [
    "typescript",
    "source_code",
    "lison"
  ],
  "author": "mitty",
  "license": "MIT",
  "bugs": {
    "url": "https://github.com/zhangruxuan/TSpre/issues"
  },
  "homepage": "https://github.com/zhangruxuan/TSpre#readme"
}

新建文件夹

-src(项目文件)
--tuils(业务相关的可复用的方法)
--tools(业务无关纯工具函数)
--assets(静态资源,如图片、字体)
--api(可复用的接口请求方法)
--config(配置文件)
-typeings(为ts模块书写的声明文件)
-build(webpack配置)

windows系统要修改一下脚本运行策略

set-executionpolicy remotesigned

或者直接以管理员方式运行命令行

npm install typescript tslint -g

tsc --init

npm install webpack webpack-cli webpack-dev-server -D

npm install ts-loader -D

clean-webpack-plugin

html-webpack-plugin

const HtmlWebpackPlugin = require('html-webpack-plugin')
//要用大括号解构 不知道为什么
const {CleanWebpackPlugin} = require('clean-webpack-plugin')

试了很多次版本最后这样可以start起来了

"devDependencies": {
    "@webpack-cli/serve": "^1.6.1",
    "clean-webpack-plugin": "^3.0.0",
    "cross-env": "^7.0.3",
    "html-webpack-plugin": "^4.5.0",
    "ts-loader": "^8.2.0",
    "typescript": "^4.6.4",
    "webpack": "^4.41.5",
    "webpack-cli": "^3.3.10",
    "webpack-dev-server": "^3.10.2"
  }