Skip to content

Commit 1010363

Browse files
finomfinom
committed
feat: Add CodeMirror and refactor Webpack config
1 parent d3f10b7 commit 1010363

15 files changed

+185
-93
lines changed

‎index.html

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -25,7 +25,7 @@
2525
</head>
2626
<body>
2727
<form>
28-
<textarea></textarea>
28+
<textarea class="code"></textarea>
2929
<button type="submit">Submit</button>
3030
<fieldset>
3131
<legend>Results</legend>

‎package.json

Lines changed: 10 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -9,7 +9,7 @@
99
"build-eslint": "rimraf eslint && npm run clone-eslint && npm run webpackify-eslint && cd eslint && npm install --production",
1010
"clone-eslint": "git clone https://github.com/eslint/eslint.git eslint",
1111
"webpackify-eslint": "node tools/webpackify-eslint",
12-
"develop": "npm run bundle-configs && NODE_ENV=development webpack-dev-server --port 8014 --no-info",
12+
"develop": "npm run bundle-configs && NODE_ENV=development webpack-dev-server --port 8014 --no-info --config webpack",
1313
"bundle": "npm run bundle-configs && NODE_ENV=production webpack --display-error-details",
1414
"bundle-configs": "node tools/bundle-configs",
1515
"check-updates": "ncu",
@@ -57,12 +57,14 @@
5757
"babel-preset-es2015": "^6.16.0",
5858
"babel-preset-stage-2": "^6.17.0",
5959
"copy-webpack-plugin": "^3.0.1",
60+
"css-loader": "^0.25.0",
6061
"eslint": "^3.7.1",
6162
"eslint-config-airbnb": "^12.0.0",
6263
"eslint-config-canonical": "^1.8.8",
6364
"eslint-config-eslint": "^3.0.0",
6465
"eslint-config-google": "^0.6.0",
6566
"eslint-config-standard": "^6.2.0",
67+
"extract-text-webpack-plugin": "^1.0.1",
6668
"ghooks": "^1.3.2",
6769
"html-webpack-plugin": "^2.22.0",
6870
"jasmine": "^2.5.2",
@@ -71,19 +73,26 @@
7173
"mkdirp": "^0.5.1",
7274
"npm-check-updates": "^2.8.5",
7375
"open-browser-webpack-plugin": "0.0.2",
76+
"postcss-calc": "^5.3.1",
77+
"postcss-cssnext": "^2.8.0",
78+
"postcss-import": "^8.1.2",
79+
"postcss-loader": "^0.13.0",
80+
"postcss-nested": "^1.0.0",
7481
"rimraf": "^2.5.4",
7582
"semantic-release": "^4.3.5",
7683
"semver": "^5.3.0",
7784
"shelljs": "^0.7.4",
7885
"shx": "^0.1.4",
7986
"string-replace-loader": "^1.0.5",
87+
"style-loader": "^0.13.1",
8088
"validate-commit-msg": "^2.8.2",
8189
"webpack": "^1.13.2",
8290
"webpack-dev-server": "^1.16.2"
8391
},
8492
"dependencies": {
8593
"babel-eslint": "^7.0.0",
8694
"babel-polyfill": "^6.16.0",
95+
"codemirror": "^5.19.0",
8796
"eslint-plugin-jsx-a11y": "^2.2.3",
8897
"eslint-plugin-promise": "^3.0.0",
8998
"eslint-plugin-react": "^6.4.1",

‎src/binders/codemirror.js

Lines changed: 28 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,28 @@
1+
import CodeMirror from 'codemirror';
2+
3+
export default function codeMirrorBinder(config) {
4+
let instance;
5+
let changeCallback;
6+
7+
return {
8+
on(callback) {
9+
changeCallback = callback;
10+
instance.on('change', changeCallback);
11+
},
12+
getValue() {
13+
instance.save();
14+
return instance.getValue();
15+
},
16+
setValue(value) {
17+
instance.setValue(value);
18+
instance.save();
19+
},
20+
initialize() {
21+
instance = CodeMirror.fromTextArea(this, config);
22+
},
23+
destroy() {
24+
instance.off('change', changeCallback);
25+
instance.toTextArea();
26+
}
27+
}
28+
}

‎src/css/style.css

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
@import '~codemirror/lib/codemirror.css';

‎src/index.js

Lines changed: 11 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -5,8 +5,7 @@ import Environments from './environments';
55
import Rules from './rules';
66
import Results from './results';
77
import configs from './lint/configs';
8-
9-
console.log(configs)
8+
import codeMirror from './binders/codemirror';
109

1110
module.exports = new class Application extends MatreshkaObject {
1211
constructor() {
@@ -20,21 +19,26 @@ module.exports = new class Application extends MatreshkaObject {
2019
node: ':sandbox .config-name',
2120
binder: {
2221
initialize() {
23-
for(const configName of configs.map(item => item.name)) {
22+
for(const { name } of configs) {
2423
this.appendChild(
2524
Object.assign(
2625
document.createElement('option'),
2726
{
28-
innerHTML: configName,
29-
value: configName
27+
innerHTML: name,
28+
value: name
3029
}
3130
)
3231
);
3332
}
3433
}
3534
}
3635
},
37-
code: ':sandbox textarea',
36+
code: {
37+
node: ':sandbox textarea',
38+
binder: codeMirror({
39+
lineNumbers: true
40+
})
41+
},
3842
parserName: ':sandbox .parser-name',
3943
useRecommended: ':sandbox .use-recommended'
4044
})
@@ -61,7 +65,7 @@ module.exports = new class Application extends MatreshkaObject {
6165
}
6266
}, true)
6367
.on({
64-
'submit::sandbox': evt => {
68+
'submit::sandbox': evt => {console.log(this.code)
6569
evt.preventDefault();
6670
const results = lint(this.code, this.toJSON());
6771

‎src/rules/index.js

Lines changed: 4 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -25,9 +25,11 @@ export default class Rules extends MatreshkaArray {
2525
for(const group of this) {
2626
for(const rule of group) {
2727
const fullRuleName = group.getFullRuleName(rule.ruleName, group.name);
28-
const recommended = this.useRecommended && group.plugin.configs
28+
const recommended = this.useRecommended
29+
&& group.plugin.configs
2930
&& group.plugin.configs.recommended
30-
&& group.plugin.configs.recommended.rules || {};
31+
&& group.plugin.configs.recommended.rules
32+
|| {};
3133

3234
rule.value = rules[fullRuleName] || recommended[fullRuleName] || 'off';
3335
}

‎webpack.config.js

Lines changed: 0 additions & 82 deletions
This file was deleted.

‎webpack/devtool.js

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
const { isDevelopment } = require('./env');
2+
3+
module.exports = isDevelopment ? 'cheap-source-map' : 'source-map';

‎webpack/entry.js

Lines changed: 17 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,17 @@
1+
const { isDevelopment, port } = require('./env');
2+
3+
const entry = {
4+
app: []
5+
};
6+
7+
if (isDevelopment) {
8+
entry.app.push(`webpack-dev-server/client?http://localhost:${port}`);
9+
}
10+
11+
entry.app.push(
12+
'./src/css/style.css',
13+
'babel-polyfill',
14+
'./src/index'
15+
);
16+
17+
module.exports = entry;

‎webpack/env.js

Lines changed: 12 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,12 @@
1+
const { NODE_ENV } = process.env;
2+
const { port } = require('minimist')(process.argv.slice(2));
3+
4+
if(!NODE_ENV) {
5+
throw Error('NODE_ENV cannot be falsy');
6+
}
7+
8+
module.exports = {
9+
isDevelopment: NODE_ENV === 'development',
10+
isProduction: NODE_ENV === 'production',
11+
port
12+
}

‎webpack/index.js

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,7 @@
1+
module.exports = {
2+
entry: require('./entry'),
3+
devtool: require('./devtool'),
4+
plugins: require('./plugins'),
5+
output: require('./output'),
6+
module: require('./module'),
7+
};

‎webpack/module.js

Lines changed: 21 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,21 @@
1+
const ExtractTextPlugin = require('extract-text-webpack-plugin');
2+
3+
module.exports = {
4+
loaders: [{
5+
test: /\.js$/,
6+
loader: 'babel',
7+
exclude: /node_modules/
8+
}, {
9+
test: /\.js$/,
10+
loaders: [
11+
`string-replace?search=require(config.parser)&replace=require("../../src/lint/parser")`, // eslint itself
12+
`string-replace?search=require(rules[ruleId])&replace=void 0`, // eslint itself
13+
]
14+
}, {
15+
test: /\.json$/,
16+
loader: 'json'
17+
}, {
18+
test: /\.css$/,
19+
loader: ExtractTextPlugin.extract('style', 'css!postcss')
20+
}]
21+
}

‎webpack/output.js

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,7 @@
1+
module.exports = {
2+
path: 'dist/',
3+
filename: 'js/[name].js',
4+
library: 'app',
5+
libraryTarget: 'var',
6+
chunkFilename: 'js/[name].chunk.js'
7+
};

‎webpack/plugins.js

Lines changed: 47 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,47 @@
1+
const webpack = require('webpack');
2+
const CopyWebpackPlugin = require('copy-webpack-plugin');
3+
const OpenBrowserPlugin = require('open-browser-webpack-plugin');
4+
const HtmlWebpackPlugin = require('html-webpack-plugin');
5+
const ExtractTextPlugin = require('extract-text-webpack-plugin');
6+
7+
const { isDevelopment, port } = require('./env');
8+
9+
const plugins = [
10+
new HtmlWebpackPlugin({
11+
template: 'index.html',
12+
chunksSortMode: (a, b) => {
13+
const order = ['manifest', 'vendor', 'app'];
14+
const nameA = a.names[0];
15+
const nameB = b.names[0];
16+
17+
return order.indexOf(nameA) - order.indexOf(nameB);
18+
}
19+
}),
20+
new ExtractTextPlugin('css/style.css', {
21+
allChunks: true
22+
})
23+
];
24+
25+
if (isDevelopment) {
26+
plugins.push(
27+
new OpenBrowserPlugin({
28+
url: `http://localhost:${port}`,
29+
ignoreErrors: true
30+
})
31+
);
32+
} else if(isProduction) {
33+
plugins.push(
34+
new webpack.optimize.UglifyJsPlugin({
35+
compress: {
36+
warnings: false
37+
}
38+
})
39+
);
40+
}
41+
42+
43+
plugins.push(
44+
new CopyWebpackPlugin([])
45+
);
46+
47+
module.exports = plugins;

‎webpack/postcss.js

Lines changed: 16 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,16 @@
1+
const postcssImport = require('postcss-import');
2+
//const postcssUrl = require('postcss-url');
3+
const postcssNested = require('postcss-nested');
4+
const postcssCssnext = require('postcss-cssnext');
5+
const postcssCalc = require('postcss-calc');
6+
7+
module.exports = webpack => [
8+
postcssImport({ addDependencyTo: webpack }),
9+
/*postcssUrl({
10+
url: 'inline',
11+
from: 'frontend/pcss/style.pcss'
12+
}),*/
13+
postcssNested(),
14+
postcssCssnext(),
15+
postcssCalc()
16+
];

0 commit comments

Comments
 (0)