From bbb0960559a645832df3535354575b91dcb0c1d8 Mon Sep 17 00:00:00 2001 From: Zack Yang Date: Thu, 21 Jul 2016 16:01:10 +0800 Subject: [PATCH] feat(component): refactor component --- .babelrc | 4 ++-- .npmignore | 19 +++++++++++++++++++ app/app.js | 4 ++-- app/component/component.service.js | 8 +++++--- app/component/form/index.js | 11 ++++++----- app/component/index.js | 19 ++++++++++--------- app/component/info/index.js | 13 +++++++------ app/component/info/info.controller.js | 4 ---- package.json | 15 ++++++--------- protractor.conf.js | 2 +- webpack.build.js | 11 +++++++++-- webpack.config.js | 2 +- webpack.dev.js | 5 ++++- 13 files changed, 72 insertions(+), 45 deletions(-) create mode 100644 .npmignore diff --git a/.babelrc b/.babelrc index c68291b..0ab0bc8 100644 --- a/.babelrc +++ b/.babelrc @@ -1,6 +1,6 @@ { - "presets": ["es2015-webpack"], - "plugins": ["lodash", "transform-runtime"], + "presets": ["es2015"], + "plugins": ["lodash"], "env": { "test": { "plugins": [ diff --git a/.npmignore b/.npmignore new file mode 100644 index 0000000..d9cb341 --- /dev/null +++ b/.npmignore @@ -0,0 +1,19 @@ +bower_components +node_modules +*.log +.DS_Store +bundle.js +test +test.js +demo/ +.babelrc +.eslintrc +.gitignore +.gitattributes +.travis.yml +.yo-rc.json +*.deb +coverage +*.tar +*.tar.gz +*.zip diff --git a/app/app.js b/app/app.js index 2fb8adf..ab8ceca 100644 --- a/app/app.js +++ b/app/app.js @@ -4,9 +4,9 @@ import 'angular-sanji-window.css'; import 'toastr.css'; import './app.scss'; import angular from 'angular'; -import component from './component'; +import {sjCellular} from './component'; -const app = angular.module('webapp', [component]); +const app = angular.module('webapp', [sjCellular]); class AppController { constructor($translate, LANG_KEYS) { this.$translate = $translate; diff --git a/app/component/component.service.js b/app/component/component.service.js index 73b9a28..3f8b92d 100644 --- a/app/component/component.service.js +++ b/app/component/component.service.js @@ -1,4 +1,6 @@ -const $inject = ['$q', 'rest', 'exception', '_', 'pathToRegexp', '$filter', 'logger']; +import _ from 'lodash'; + +const $inject = ['$q', 'rest', 'exception', 'pathToRegexp', '$filter', 'logger']; const config = require('./component.resource.json'); class CellularService { constructor(...injects) { @@ -18,7 +20,7 @@ class CellularService { _transform(data) { switch(config.get.type) { case 'collection': - return this._.map(data, (item, index) => { + return _.map(data, (item, index) => { return { title: (config.get.titlePrefix || 'tab') + index, content: item, @@ -33,7 +35,7 @@ class CellularService { fields: config.fields }; default: - return this._.map(data, (item, index) => { + return _.map(data, (item, index) => { return { title: (config.get.titlePrefix || 'tab') + index, content: item, diff --git a/app/component/form/index.js b/app/component/form/index.js index 2512034..f629ef0 100644 --- a/app/component/form/index.js +++ b/app/component/form/index.js @@ -1,11 +1,12 @@ import angular from 'angular'; -import sjCore from 'sanji-core-ui'; +import {sjCore} from 'sanji-core-ui'; import './form.tpl.html'; import CellularFormContainerComponent from './container.component'; import CellularFormComponent from './form.component'; -let app = angular.module('sanji.cellular.form', [sjCore]); -app.component('sanjiCellularFormContainer', CellularFormContainerComponent); -app.component('sanjiCellularForm', CellularFormComponent); -export default app = app.name; +const sjCellularForm = angular.module('sanji.cellular.form', [sjCore]) + .component('sanjiCellularFormContainer', CellularFormContainerComponent) + .component('sanjiCellularForm', CellularFormComponent) + .name; +export {sjCellularForm}; diff --git a/app/component/index.js b/app/component/index.js index 5aa75d2..da34dba 100644 --- a/app/component/index.js +++ b/app/component/index.js @@ -1,18 +1,19 @@ import angular from 'angular'; -import sjCore from 'sanji-core-ui'; -import sjCellularInfo from './info'; -import sjCellularForm from './form'; +import {sjCore} from 'sanji-core-ui'; +import {sjCellularInfo} from './info'; +import {sjCellularForm} from './form'; import i18nConfig from './component.i18n'; import CellularService from './component.service'; import CellularWindowComponent from './window.component'; -let app = angular.module('sanji.cellular', [ +const sjCellular = angular.module('sanji.cellular', [ sjCore, sjCellularInfo, sjCellularForm -]); -app.config(i18nConfig); -app.service('cellularService', CellularService); -app.component('sanjiCellularWindow', CellularWindowComponent); -export default app = app.name; +]) +.config(i18nConfig) +.service('cellularService', CellularService) +.component('sanjiCellularWindow', CellularWindowComponent) +.name; +export {sjCellular}; diff --git a/app/component/info/index.js b/app/component/info/index.js index dfcce2f..97ceae6 100644 --- a/app/component/info/index.js +++ b/app/component/info/index.js @@ -1,5 +1,5 @@ import angular from 'angular'; -import sjCore from 'sanji-core-ui'; +import {sjCore} from 'sanji-core-ui'; import './cellular-signal.tpl.html'; import './cellular-signal.style.scss'; @@ -9,8 +9,9 @@ import './info.tpl.html'; import CellularInfoContainerComponent from './container.component'; import CellularInfoComponent from './info.component'; -let app = angular.module('sanji.cellular.info', [sjCore]); -app.component('sanjiCellularInfoContainer', CellularInfoContainerComponent); -app.component('sanjiCellularInfo', CellularInfoComponent); -app.component('cellularSignal', CellularSignalComponent); -export default app = app.name; +const sjCellularInfo = angular.module('sanji.cellular.info', [sjCore]) + .component('sanjiCellularInfoContainer', CellularInfoContainerComponent) + .component('sanjiCellularInfo', CellularInfoComponent) + .component('cellularSignal', CellularSignalComponent) + .name; +export {sjCellularInfo}; diff --git a/app/component/info/info.controller.js b/app/component/info/info.controller.js index 3521cd5..813fb6a 100644 --- a/app/component/info/info.controller.js +++ b/app/component/info/info.controller.js @@ -3,10 +3,6 @@ class CellularInfoController { constructor(...injects) { CellularInfoController.$inject.forEach((item, index) => this[item] = injects[index]); } - - save(data) { - this.submitCallback({data: data}); - } } CellularInfoController.$inject = $inject; export default CellularInfoController; diff --git a/package.json b/package.json index 529f70d..77a0d50 100644 --- a/package.json +++ b/package.json @@ -31,16 +31,13 @@ }, "devDependencies": { "angular-mocks": "~1.5.0", - "autoprefixer-loader": "~3.2.0", + "autoprefixer": "~6.3.7", "babel-core": "^6.0.0", "babel-eslint": "^6.0.4", "babel-loader": "^6.0.0", "babel-plugin-__coverage__": "^11.0.0", "babel-plugin-lodash": "^3.2.4", - "babel-plugin-transform-es2015-modules-commonjs": "^6.10.3", - "babel-plugin-transform-runtime": "^6.0.0", - "babel-preset-es2015-webpack": "^6.4.1", - "babel-runtime": "^6.6.1", + "babel-preset-es2015": "^6.9.0", "chai": "~3.5.0", "commitizen": "^2.8.0", "css-loader": "~0.23.1", @@ -49,7 +46,7 @@ "eslint": "^2.0.0", "eslint-loader": "^1.3.0", "expose-loader": "~0.7.1", - "extract-text-webpack-plugin": "2.0.0-beta.1", + "extract-text-webpack-plugin": "^2.0.0-beta.3", "file-loader": "~0.9.0", "ghooks": "^1.2.0", "html-webpack-plugin": "~2.22.0", @@ -78,8 +75,8 @@ "semantic-release": "^4.3.5", "style-loader": "~0.13.0", "url-loader": "~0.5.7", - "webpack": "2.1.0-beta.17", - "webpack-dev-server": "2.1.0-beta.0", + "webpack": "^2.1.0-beta.20", + "webpack-dev-server": "^2.1.0-beta.0", "webpack-notifier": "~1.3.0" }, "repository": { @@ -95,6 +92,6 @@ "license": "MIT", "homepage": "https://github.com/Sanji-IO/sanji-cellular-ui", "dependencies": { - "sanji-core-ui": "~1.15.3" + "sanji-core-ui": "~1.16.0" } } diff --git a/protractor.conf.js b/protractor.conf.js index 9cb48c8..70aecba 100644 --- a/protractor.conf.js +++ b/protractor.conf.js @@ -33,7 +33,7 @@ exports.config = { ], cucumberOpts: { - require: 'features/token.step.js', + require: 'features/cellular.step.js', format: 'pretty' // or summary } }; diff --git a/webpack.build.js b/webpack.build.js index 4343f0f..f2a20dd 100644 --- a/webpack.build.js +++ b/webpack.build.js @@ -21,10 +21,16 @@ config.externals = [ config.module.loaders = [ { test: /\.scss$/, - loader: ExtractTextPlugin.extract('style-loader', 'css!postcss!sass?includePaths[]=' + bourbon) + loader: ExtractTextPlugin.extract({ + notExtractLoader: 'style-loader', + loader: 'css!postcss!sass?includePaths[]=' + bourbon + }) } ].concat(config.module.loaders); +config.module.postLoaders = [ + {test: /\.js$/, loader: 'ng-annotate', exclude: /(node_modules)/} +]; config.postcss = [ autoprefixer({ browsers: ['last 2 versions'] }) ]; config.plugins.push( @@ -38,7 +44,8 @@ config.plugins.push( new webpack.optimize.UglifyJsPlugin({ compress: { screw_ie8: true, - warnings: false + warnings: false, + dead_code: true } }) ); diff --git a/webpack.config.js b/webpack.config.js index ae2e159..ec66aea 100644 --- a/webpack.config.js +++ b/webpack.config.js @@ -31,7 +31,7 @@ var config = { {test: /\.js$/, loader: 'eslint', exclude: /(node_modules)/} ], loaders: [ - { test: /\.js$/, loader: 'ng-annotate!babel?cacheDirectory', exclude: /node_modules/ }, + { test: /\.js$/, loader: 'babel?cacheDirectory', exclude: /node_modules/ }, { test: /\.json$/, loader: 'json', exclude: /node_modules/ }, { test: /\.html$/, loader: 'ng-cache?prefix=[dir]/[dir]', exclude: [/node_modules/, path.join(__dirname, '/app/index.html')] } ], diff --git a/webpack.dev.js b/webpack.dev.js index 46f5e38..cee59b0 100644 --- a/webpack.dev.js +++ b/webpack.dev.js @@ -20,12 +20,15 @@ config.entry = { }; config.module.loaders = [ {test: /\.scss/, loader: 'style!css!postcss!sass?includePaths[]=' + bourbon}, - {test: /\.css$/, loader: 'style!css!autoprefixer?browsers=last 2 versions'}, + {test: /\.css$/, loader: 'style!css!postcss?browsers=last 2 versions'}, {test: /\.(png|jpg|gif|jpeg)$/, loader: 'url-loader?limit=8192', exclude: /node_modules/}, {test: /\.(woff|woff2)$/, loader: 'url?limit=10000&minetype=application/font-woff', exclude: /node_modules/}, {test: /\.(ttf|eot|svg)$/, loader: 'file', exclude: /node_modules/} ].concat(config.module.loaders); +config.module.postLoaders = [ + {test: /\.js$/, loader: 'ng-annotate', exclude: /(node_modules)/} +]; config.postcss = [ autoprefixer({ browsers: ['last 2 versions'] }) ]; config.plugins.push(