refact(-): add css loader and modulize css

CoderK · Sep 3, 2016 · a0dcf03 · a0dcf03
1 parent a88725d
commit a0dcf03
Show file tree

Hide file tree

Showing 5 changed files with 5 additions and 7 deletions.
diff --git a/manifest.json b/manifest.json
@@ -12,10 +12,6 @@
     "tabs"
   ],
 
-  "web_accessible_resources": [
-    "./resources/css/gfe.css"
-  ],
-
   "content_scripts": [
     {
       "matches": [
@@ -25,9 +21,6 @@
       "js": [
         "./dist/bundle.js"
       ],
-      "css": [
-        "./resources/css/gfe.css"
-      ],
       "run_at": "document_idle"
     }
   ],

diff --git a/package.json b/package.json
@@ -12,7 +12,9 @@
     "babel-core": "^6.14.0",
     "babel-loader": "^6.2.5",
     "babel-preset-es2015": "^6.14.0",
+    "css-loader": "^0.24.0",
     "lodash-template-webpack-loader": "^1.0.2",
+    "style-loader": "^0.13.1",
     "webpack": "^1.13.2"
   },
   "scripts": {

diff --git a/resources/css/gfe.css → src/filter/css/gfe.css b/resources/css/gfe.css → src/filter/css/gfe.css
diff --git a/src/filter/main.js b/src/filter/main.js
@@ -2,6 +2,8 @@ import intent from './intent';
 import model from './model';
 import view from './view';
 
+require("./css/gfe.css");
+
 function main(props) {
     const actions = intent(props);
     const state$ = model(actions, props);

diff --git a/webpack.config.js b/webpack.config.js
@@ -15,6 +15,7 @@ module.exports = {
     devtool: env === 'production' ? false : 'inline-source-map',
     module: {
         loaders: [
+            { test: /\.css$/, loader: "style-loader!css-loader" },
             {
                 test: /\.js$/,
                 loader: 'babel',