Skip to content

Commit

Permalink
feat: remove fork-ts-checker-webpack-plugin from dependency
Browse files Browse the repository at this point in the history
Add it to the docs, so that packages that require typescript are
able to add to their dependency.

See #29
  • Loading branch information
swashata committed Oct 30, 2018
1 parent ec16d00 commit b1d3c07
Show file tree
Hide file tree
Showing 4 changed files with 825 additions and 156 deletions.
207 changes: 103 additions & 104 deletions packages/scripts/package.json
Original file line number Diff line number Diff line change
@@ -1,106 +1,105 @@
{
"name": "@wpackio/scripts",
"version": "2.2.0",
"description": "Main single dependency of @wpackio build tool.",
"keywords": [
"wordpress",
"bundler",
"webpack",
"browser-sync",
"wordpress-bundler"
],
"main": "lib/index.js",
"bin": {
"wpackio-scripts": "lib/bin/index.js"
},
"repository": "https://github.com/swashata/wp-webpack-script",
"homepage": "https://wpack.io",
"author": "Swashata Ghosh <[email protected]> (https://swas.io)",
"license": "MIT",
"private": false,
"dependencies": {
"@babel/core": "^7.1.0",
"@babel/preset-flow": "^7.0.0",
"@babel/preset-typescript": "^7.1.0",
"@types/browser-sync": "^0.0.42",
"@types/camelcase": "^4.1.0",
"@types/execa": "^0.9.0",
"@types/figlet": "^1.2.0",
"@types/figures": "^2.0.0",
"@types/find-up": "^2.1.1",
"@types/gradient-string": "^1.1.0",
"@types/handlebars": "^4.0.39",
"@types/inquirer": "^0.0.43",
"@types/log-symbols": "^2.0.0",
"@types/node": "^10.11.3",
"@types/ora": "^1.3.4",
"@types/update-notifier": "^2.2.0",
"@types/webpack": "^4.4.13",
"@types/webpack-assets-manifest": "^3.0.0",
"@types/webpack-dev-middleware": "^2.0.2",
"@types/webpack-env": "^1.13.6",
"@types/webpack-hot-middleware": "^2.16.4",
"@wpackio/babel-preset-base": "^2.2.0",
"autoprefixer": "^9.1.5",
"babel-loader": "^8.0.2",
"boxen": "^2.0.0",
"browser-sync": "^2.24.7",
"camelcase": "^5.0.0",
"chalk": "^2.4.1",
"clean-webpack-plugin": "^0.1.19",
"commander": "^2.18.0",
"css-loader": "^1.0.0",
"dev-ip": "^1.0.1",
"execa": "^1.0.0",
"figlet": "^1.2.0",
"figures": "^2.0.0",
"file-loader": "^2.0.0",
"find-up": "^3.0.0",
"fork-ts-checker-webpack-plugin": "^0.4.10",
"gradient-string": "^1.2.0",
"handlebars": "^4.0.12",
"inquirer": "^6.2.0",
"log-symbols": "^2.2.0",
"mini-css-extract-plugin": "^0.4.3",
"optimize-css-assets-webpack-plugin": "^5.0.1",
"ora": "^3.0.0",
"postcss-loader": "^3.0.0",
"pretty-error": "^2.1.1",
"react-dev-utils": "^6.0.4",
"sass-loader": "^7.1.0",
"slugify": "^1.3.1",
"style-loader": "^0.23.0",
"time-fix-plugin": "^2.0.3",
"uglifyjs-webpack-plugin": "^2.0.1",
"update-notifier": "^2.5.0",
"webpack": "^4.20.2",
"webpack-assets-manifest": "^3.1.0",
"webpack-dev-middleware": "^3.4.0",
"webpack-hot-middleware": "^2.24.0",
"webpack-merge": "^4.1.4"
},
"engines": {
"node": ">=8.9.0"
},
"files": [
"lib",
"templates"
],
"scripts": {
"clean": "rimraf './lib'",
"type-check": "tsc --noEmit",
"type-check:watch": "yarn type-check --watch",
"build:js": "babel ./src --out-dir lib --extensions '.ts,.tsx'",
"build:types": "tsc --emitDeclarationOnly",
"build": "yarn clean && yarn build:types && yarn build:js",
"lint": "tslint --project './tsconfig.json'",
"test": "jest --color",
"prepare": "cross-env NODE_ENV=production yarn build"
},
"publishConfig": {
"access": "public"
},
"devDependencies": {
"dts-gen": "0.5.7"
}
"name": "@wpackio/scripts",
"version": "2.2.0",
"description": "Main single dependency of @wpackio build tool.",
"keywords": [
"wordpress",
"bundler",
"webpack",
"browser-sync",
"wordpress-bundler"
],
"main": "lib/index.js",
"bin": {
"wpackio-scripts": "lib/bin/index.js"
},
"repository": "https://github.com/swashata/wp-webpack-script",
"homepage": "https://wpack.io",
"author": "Swashata Ghosh <[email protected]> (https://swas.io)",
"license": "MIT",
"private": false,
"dependencies": {
"@babel/core": "^7.1.0",
"@babel/preset-flow": "^7.0.0",
"@babel/preset-typescript": "^7.1.0",
"@types/browser-sync": "^0.0.42",
"@types/camelcase": "^4.1.0",
"@types/execa": "^0.9.0",
"@types/figlet": "^1.2.0",
"@types/figures": "^2.0.0",
"@types/find-up": "^2.1.1",
"@types/gradient-string": "^1.1.0",
"@types/handlebars": "^4.0.39",
"@types/inquirer": "^0.0.43",
"@types/log-symbols": "^2.0.0",
"@types/node": "^10.11.3",
"@types/ora": "^1.3.4",
"@types/update-notifier": "^2.2.0",
"@types/webpack": "^4.4.13",
"@types/webpack-assets-manifest": "^3.0.0",
"@types/webpack-dev-middleware": "^2.0.2",
"@types/webpack-env": "^1.13.6",
"@types/webpack-hot-middleware": "^2.16.4",
"@wpackio/babel-preset-base": "^2.2.0",
"autoprefixer": "^9.1.5",
"babel-loader": "^8.0.2",
"boxen": "^2.0.0",
"browser-sync": "^2.24.7",
"camelcase": "^5.0.0",
"chalk": "^2.4.1",
"clean-webpack-plugin": "^0.1.19",
"commander": "^2.18.0",
"css-loader": "^1.0.0",
"dev-ip": "^1.0.1",
"execa": "^1.0.0",
"figlet": "^1.2.0",
"figures": "^2.0.0",
"file-loader": "^2.0.0",
"find-up": "^3.0.0",
"gradient-string": "^1.2.0",
"handlebars": "^4.0.12",
"inquirer": "^6.2.0",
"log-symbols": "^2.2.0",
"mini-css-extract-plugin": "^0.4.3",
"optimize-css-assets-webpack-plugin": "^5.0.1",
"ora": "^3.0.0",
"postcss-loader": "^3.0.0",
"pretty-error": "^2.1.1",
"react-dev-utils": "^6.0.4",
"sass-loader": "^7.1.0",
"slugify": "^1.3.1",
"style-loader": "^0.23.0",
"time-fix-plugin": "^2.0.3",
"uglifyjs-webpack-plugin": "^2.0.1",
"update-notifier": "^2.5.0",
"webpack": "^4.20.2",
"webpack-assets-manifest": "^3.1.0",
"webpack-dev-middleware": "^3.4.0",
"webpack-hot-middleware": "^2.24.0",
"webpack-merge": "^4.1.4"
},
"engines": {
"node": ">=8.9.0"
},
"files": [
"lib",
"templates"
],
"scripts": {
"clean": "rimraf './lib'",
"type-check": "tsc --noEmit",
"type-check:watch": "yarn type-check --watch",
"build:js": "babel ./src --out-dir lib --extensions '.ts,.tsx'",
"build:types": "tsc --emitDeclarationOnly",
"build": "yarn clean && yarn build:types && yarn build:js",
"lint": "tslint --project './tsconfig.json'",
"test": "jest --color",
"prepare": "cross-env NODE_ENV=production yarn build"
},
"publishConfig": {
"access": "public"
},
"devDependencies": {
"dts-gen": "0.5.7"
}
}
6 changes: 5 additions & 1 deletion site/docs/concepts/how-everything-works-together.md
Original file line number Diff line number Diff line change
Expand Up @@ -9,11 +9,15 @@ we had to consider to make sure it works nicely with WordPress.

## Choice of tooling

- We use [webpack](https://webpack.js.org/) as the primary compiler.
- We use [webpack](https://webpack.js.org/) as the primary bundler.
- [Browser Sync](https://browsersync.io/), along with `webpack-dev-middleware`
acts as the development server.
- `webpack-hot-middleware` is used to provide all the **HOT MODULE REPLACEMENT**
(_HMR_) goodness.
- `babel-loader` as the webpack module loader which uses babel under the hood
to compile modern JavaScript/Typescript code.
- `sass-loader`, `postcss-loader`, `autoprefixer` along with `mini-css-extract-plugin`
to handle CSS/SASS/SCSS source.

Everything fits in together when we pass the middlewares to browsersync.

Expand Down
10 changes: 7 additions & 3 deletions site/docs/guides/adding-typescript.md
Original file line number Diff line number Diff line change
Expand Up @@ -9,8 +9,8 @@ there are some configuration needed for typescript.

## Provided tooling

`@wpackio/scripts` comes with the build tooling for typescript, not typescript
itself. Also note that, we use [babel 7](https://babeljs.io/docs/en/babel-preset-typescript)
`@wpackio/scripts` comes with the build tooling for typescript, not typescript and
webpack plugins. Also note that, we use [babel 7](https://babeljs.io/docs/en/babel-preset-typescript)
to compile typescript and [Fork TS Checked Webpack Plugin](https://github.com/Realytics/fork-ts-checker-webpack-plugin)
to show type-errors during build/development time. So there are some gotchas.

Expand All @@ -31,7 +31,7 @@ So keep these in mind.
First we need to install `typescript` itself.

```bash
npm i -D typescript
npm i -D typescript fork-ts-checker-webpack-plugin
```

Now create `tsconfig.json` at the root according to your need. Here's a sample.
Expand Down Expand Up @@ -78,3 +78,7 @@ module.exports = {
```

Now you are good to go. The compiler will also show any `ts` error you might have.

> **NOTE** - Internally wpack.io depends on [`fork-ts-checker-webpack-plugin`]()
> to show type errors during build time. So make sure you install it, otherwise
> it will not work.
Loading

0 comments on commit b1d3c07

Please sign in to comment.