Revert "Using file-loader to load all the extensions. (#653)"

This reverts commit 56a7bf8.
storybookjs · Dec 20, 2016 · 6dcd081 · 6dcd081
1 parent e715182
commit 6dcd081
Show file tree

Hide file tree

Showing 3 changed files with 34 additions and 27 deletions.
diff --git a/dist/client/preview/index.js b/dist/client/preview/index.js
@@ -55,7 +55,7 @@ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { de
 var _global = global,
     navigator = _global.navigator; /* global window */
 
-var isBrowser = navigator && navigator.userAgent !== 'storyshots' && !navigator.userAgent.includes('Node.js');
+var isBrowser = navigator && navigator.userAgent !== 'storyshots';
 
 var storyStore = new _story_store2.default();
 var reduxStore = (0, _redux.createStore)(_reducer2.default);

diff --git a/dist/server/config/defaults/webpack.config.js b/dist/server/config/defaults/webpack.config.js
@@ -19,24 +19,29 @@ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { de
 // Add a default custom config which is similar to what React Create App does.
 module.exports = function (storybookBaseConfig) {
   var newConfig = (0, _extends3.default)({}, storybookBaseConfig);
-  newConfig.module.loaders = [].concat((0, _toConsumableArray3.default)(storybookBaseConfig.module.loaders), [
-  // This loads all other assets using the file-loader except for
-  // the excluded extentions. Because they have their own loaders.
-  {
-    include: _utils.includePaths,
-    exclude: [/\.html$/, /\.(js|jsx)$/, /\.css$/, /\.json$/],
-    loader: require.resolve('file-loader'),
-    query: {
-      name: 'static/media/[name].[hash:8].[ext]'
-    }
-  }, {
+  newConfig.module.loaders = [].concat((0, _toConsumableArray3.default)(storybookBaseConfig.module.loaders), [{
     test: /\.css?$/,
     include: _utils.includePaths,
     loaders: [require.resolve('style-loader'), require.resolve('css-loader') + '?importLoaders=1', require.resolve('postcss-loader')]
   }, {
     test: /\.json$/,
     include: _utils.includePaths,
     loader: require.resolve('json-loader')
+  }, {
+    test: /\.(ico|jpg|jpeg|png|gif|eot|otf|webp|svg|ttf|woff|woff2)(\?.*)?$/,
+    include: _utils.includePaths,
+    loader: require.resolve('file-loader'),
+    query: {
+      name: 'static/media/[name].[hash:8].[ext]'
+    }
+  }, {
+    test: /\.(mp4|webm|wav|mp3|m4a|aac|oga)(\?.*)?$/,
+    include: _utils.includePaths,
+    loader: require.resolve('url-loader'),
+    query: {
+      limit: 10000,
+      name: 'static/media/[name].[hash:8].[ext]'
+    }
   }]);
 
   newConfig.postcss = function () {

diff --git a/src/server/config/defaults/webpack.config.js b/src/server/config/defaults/webpack.config.js
@@ -6,21 +6,6 @@ module.exports = (storybookBaseConfig) => {
   const newConfig = { ...storybookBaseConfig };
   newConfig.module.loaders = [
     ...storybookBaseConfig.module.loaders,
-    // This loads all other assets using the file-loader except for
-    // the excluded extentions. Because they have their own loaders.
-    {
-      include: includePaths,
-      exclude: [
-        /\.html$/,
-        /\.(js|jsx)$/,
-        /\.css$/,
-        /\.json$/,
-      ],
-      loader: require.resolve('file-loader'),
-      query: {
-        name: 'static/media/[name].[hash:8].[ext]',
-      },
-    },
     {
       test: /\.css?$/,
       include: includePaths,
@@ -35,6 +20,23 @@ module.exports = (storybookBaseConfig) => {
       include: includePaths,
       loader: require.resolve('json-loader'),
     },
+    {
+      test: /\.(ico|jpg|jpeg|png|gif|eot|otf|webp|svg|ttf|woff|woff2)(\?.*)?$/,
+      include: includePaths,
+      loader: require.resolve('file-loader'),
+      query: {
+        name: 'static/media/[name].[hash:8].[ext]',
+      },
+    },
+    {
+      test: /\.(mp4|webm|wav|mp3|m4a|aac|oga)(\?.*)?$/,
+      include: includePaths,
+      loader: require.resolve('url-loader'),
+      query: {
+        limit: 10000,
+        name: 'static/media/[name].[hash:8].[ext]',
+      },
+    },
   ];
 
   newConfig.postcss = () => {