Skip to content

Commit

Permalink
Forbid Webpack loader syntax in imports
Browse files Browse the repository at this point in the history
Enable no-webpack-loader-syntax rule in eslint-config-react-app.
  • Loading branch information
fson committed Sep 30, 2016
1 parent 0ad930e commit 1eea3ad
Show file tree
Hide file tree
Showing 6 changed files with 13 additions and 8 deletions.
2 changes: 1 addition & 1 deletion package.json
Original file line number Diff line number Diff line change
Expand Up @@ -14,7 +14,7 @@
"eslint": "3.5.0",
"eslint-config-react-app": "file:packages/eslint-config-react-app",
"eslint-plugin-flowtype": "2.18.1",
"eslint-plugin-import": "1.12.0",
"eslint-plugin-import": "2.0.0",
"eslint-plugin-jsx-a11y": "2.2.2",
"eslint-plugin-react": "6.3.0",
"lerna": "2.0.0-beta.29"
Expand Down
2 changes: 1 addition & 1 deletion packages/eslint-config-react-app/README.md
Original file line number Diff line number Diff line change
Expand Up @@ -17,7 +17,7 @@ If you want to use this ESLint configuration in a project not built with Create
First, install this package, ESLint and the necessary plugins.

```sh
npm install --save-dev eslint-config-react-app babel-eslint@6.1.2 eslint@3.5.0 eslint-plugin-flowtype@2.18.1 eslint-plugin-import@1.12.0 eslint-plugin-jsx-a11y@2.2.2 eslint-plugin-react@5.2.2
npm install --save-dev eslint-config-react-app babel-eslint@6.1.2 eslint@3.5.0 eslint-plugin-flowtype@2.18.1 eslint-plugin-import@2.0.0 eslint-plugin-jsx-a11y@2.2.2 eslint-plugin-react@6.3.0
```

Then create a file named `.eslintrc` with following contents in the root folder of your project:
Expand Down
9 changes: 7 additions & 2 deletions packages/eslint-config-react-app/index.js
Original file line number Diff line number Diff line change
Expand Up @@ -21,8 +21,7 @@ module.exports = {

parser: 'babel-eslint',

// import plugin is temporarily disabled, scroll below to see why
plugins: [/*'import', */'flowtype', 'jsx-a11y', 'react'],
plugins: ['import', 'flowtype', 'jsx-a11y', 'react'],

env: {
browser: true,
Expand Down Expand Up @@ -170,6 +169,9 @@ module.exports = {
// This is probably fixable with a patch to eslint-loader.
// When file A is saved, we want to invalidate all files that import it
// *and* that currently have lint errors. This should fix the problem.
// (As an exception, import/no-webpack-loader-syntax can be enabled already
// because it doesn't depend on whether the file exists, so this issue
// doesn't apply to it.)

// 'import/default': 'warn',
// 'import/export': 'warn',
Expand All @@ -181,6 +183,9 @@ module.exports = {
// 'import/no-named-as-default': 'warn',
// 'import/no-named-as-default-member': 'warn',
// 'import/no-unresolved': ['warn', { commonjs: true }],
// We don't support configuring Webpack using import source strings, so this
// is always an error.
'import/no-webpack-loader-syntax': 'error',

// https://github.com/yannickcr/eslint-plugin-react/tree/master/docs/rules
'react/jsx-equals-spacing': ['warn', 'never'],
Expand Down
2 changes: 1 addition & 1 deletion packages/eslint-config-react-app/package.json
Original file line number Diff line number Diff line change
Expand Up @@ -14,7 +14,7 @@
"babel-eslint": "6.1.2",
"eslint": "3.5.0",
"eslint-plugin-flowtype": "2.18.1",
"eslint-plugin-import": "1.12.0",
"eslint-plugin-import": "2.0.0",
"eslint-plugin-jsx-a11y": "2.2.2",
"eslint-plugin-react": "6.3.0"
}
Expand Down
2 changes: 1 addition & 1 deletion packages/react-scripts/package.json
Original file line number Diff line number Diff line change
Expand Up @@ -40,7 +40,7 @@
"eslint-config-react-app": "^0.2.1",
"eslint-loader": "1.5.0",
"eslint-plugin-flowtype": "2.18.1",
"eslint-plugin-import": "1.12.0",
"eslint-plugin-import": "2.0.0",
"eslint-plugin-jsx-a11y": "2.2.2",
"eslint-plugin-react": "6.3.0",
"extract-text-webpack-plugin": "1.0.1",
Expand Down
4 changes: 2 additions & 2 deletions packages/react-scripts/template/README.md
Original file line number Diff line number Diff line change
Expand Up @@ -174,7 +174,7 @@ Then add this block to the `package.json` file of your project:
Finally, you will need to install some packages *globally*:

```sh
npm install -g eslint-config-react-app@0.2.1 eslint@3.5.0 babel-eslint@6.1.2 eslint-plugin-react@6.3.0 eslint-plugin-import@1.12.0 eslint-plugin-jsx-a11y@2.2.2 eslint-plugin-flowtype@2.18.1
npm install -g eslint-config-react-app@0.2.1 eslint@3.5.0 babel-eslint@6.1.2 eslint-plugin-react@6.3.0 eslint-plugin-import@2.0.0 eslint-plugin-jsx-a11y@2.2.2 eslint-plugin-flowtype@2.18.1
```

We recognize that this is suboptimal, but it is currently required due to the way we hide the ESLint dependency. The ESLint team is already [working on a solution to this](https://github.com/eslint/eslint/issues/3458) so this may become unnecessary in a couple of months.
Expand Down Expand Up @@ -362,7 +362,7 @@ Inside `index.html`, you can use it like this:

Only files inside the `public` folder will be accessible by `%PUBLIC_URL%` prefix. If you need to use a file from `src` or `node_modules`, you’ll have to copy it there to explicitly specify your intention to make this file a part of the build.

When you run `npm run build`, Create React App will substitute `%PUBLIC_URL%` with a correct absolute path so your project works even if you use client-side routing or host it at a non-root URL.
When you run `npm run build`, Create React App will substitute `%PUBLIC_URL%` with a correct absolute path so your project works even if you use client-side routing or host it at a non-root URL.

In JavaScript code, you can use `process.env.PUBLIC_URL` for similar purposes:

Expand Down

0 comments on commit 1eea3ad

Please sign in to comment.