newspack-scripts 1.2.0 → 1.4.2

package/README.md

@@ -10,3 +10,68 @@ Will run `jest` tests. Useful flags:
 
 - `--watch` to run in file watch mode,
 - `--coverage` to collect test coverage
+
+### build
+
+Will run `calypso-build`, creating optimised production builds.
+
+### start
+
+Will run `calypso-build` in watch mode.
+
+## Available configs
+
+This package exposes a couple of configuration files.
+
+### webpack
+
+The `webpack.config.js` file should use this package's config-extending function:
+
+```js
+const getBaseWebpackConfig = require( 'newspack-scripts/config/getWebpackConfig' );
+
+const webpackConfig = getBaseWebpackConfig(
+  { WP: true },
+  {
+    entry: {
+      'some-script': './src/some-script.js'
+    },
+  }
+);
+
+module.exports = webpackConfig;
+```
+
+### babel
+
+A basic `babel.config.js`:
+
+```js
+module.exports = api => {
+  api.cache( true );
+  return {
+    extends: 'newspack-scripts/config/babel.config.js',
+  };
+};
+```
+
+### eslint
+
+Because of eslint's [issue](https://github.com/eslint/eslint/issues/3458) with resolving dependencies of extended configurations, a patch has to be used to use this config in a stand-alone fashion: install `@rushstack/eslint-patch` and set up the `.eslintrc.js` like so:
+
+```js
+require( '@rushstack/eslint-patch/modern-module-resolution' );
+
+module.exports = {
+  extends: [ './node_modules/newspack-scripts/config/eslintrc.js' ],
+  // Additional options…
+};
+```
+
+### stylelint
+
+Install `stylelint` via npm and reference this package's config file when running it, e.g.:
+
+```shell
+stylelint '**/*.scss' --syntax scss --config=./node_modules/newspack-scripts/config/stylelint.config.js
+```

package/config/eslintrc.js

@@ -0,0 +1,32 @@
+module.exports = {
+  extends: [
+    "plugin:@wordpress/eslint-plugin/recommended",
+    "plugin:react/recommended",
+    "plugin:import/errors",
+    "plugin:import/warnings",
+  ],
+  env: {
+    browser: true,
+    jest: true,
+  },
+  ignorePatterns: ["dist/", "node_modules/"],
+  parser: "@babel/eslint-parser",
+  rules: {
+    "no-console": "off",
+    camelcase: "off",
+    // Disallow importing or requiring packages that are not listed in package.json
+    // This prevents us from depending on transitive dependencies, which could break in unexpected ways.
+    "import/no-extraneous-dependencies": ["error", { packageDir: "." }],
+    // There's a conflict with prettier here:
+    "react/jsx-curly-spacing": "off",
+    // Skip prop types validation for now
+    "react/prop-types": "off",
+    "react/react-in-jsx-scope": "off",
+    "react/self-closing-comp": "error",
+    // JSDoc rules overrides
+    "jsdoc/require-returns": "off",
+    "jsdoc/require-param": "off",
+    // Deprecated rules
+    "jsx-a11y/no-onchange": "off",
+  },
+};

package/config/stylelint.config.js

@@ -0,0 +1,21 @@
+module.exports = {
+  extends: [
+    "@wordpress/stylelint-config/scss",
+    "stylelint-prettier/recommended",
+  ],
+  rules: {
+    "rule-empty-line-before": null,
+    "at-rule-empty-line-before": null,
+    "comment-empty-line-before": null,
+    "string-quotes": "single",
+    "no-descending-specificity": null,
+    "function-url-quotes": null,
+    "declaration-property-unit-whitelist": null,
+    "font-weight-notation": null,
+    "color-named": null,
+    "function-parentheses-space-inside": "always-single-line",
+    "media-feature-parentheses-space-inside": "always",
+    "selector-pseudo-class-parentheses-space-inside": "always",
+    "selector-class-pattern": null,
+  },
+};

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "newspack-scripts",
-  "version": "1.2.0",
+  "version": "1.4.2",
   "description": "",
   "bin": {
     "newspack-scripts": "./bin/newspack-scripts.js"
@@ -9,16 +9,28 @@
   "license": "ISC",
   "dependencies": {
     "@automattic/calypso-build": "^10.0.0",
+    "@babel/eslint-parser": "^7.16.3",
     "@babel/preset-env": "^7.16.4",
     "@testing-library/jest-dom": "^5.15.1",
     "@testing-library/react": "^12.1.2",
+    "@wordpress/eslint-plugin": "^9.3.0",
+    "@wordpress/stylelint-config": "^19.1.0",
     "autoprefixer": "^10.4.0",
     "babel-jest": "^27.4.2",
     "cross-spawn": "^7.0.3",
+    "eslint": "^7.32.0",
+    "eslint-config-prettier": "^8.3.0",
+    "eslint-plugin-import": "^2.25.3",
+    "eslint-plugin-jest": "^25.3.0",
+    "eslint-plugin-react": "^7.27.1",
     "jest": "^27.4.3",
     "jest-environment-jsdom": "^27.4.3",
     "postcss": "^8.4.4",
     "postcss-focus-within": "^5.0.1",
+    "prettier": "npm:wp-prettier@2.2.1-beta-1",
+    "stylelint": "^13.3.1",
+    "stylelint-config-prettier": "^9.0.3",
+    "stylelint-prettier": "^1.2.0",
     "webpack": "^5.65.0"
   },
   "scripts": {