BREAKING kill deprecated asset support

Summary:
This removes support for `require('image!…')`, which has been deprecated for a long time.

It is still possible to use images that are already bundled by the native app using the `nativeImageSource` module.
Check http://facebook.github.io/react-native/docs/images.html for detailed documentation.

Reviewed By: matryoshcow

Differential Revision: D4231208

fbshipit-source-id: 05ec4c1ca0fabdc3fbb652f8ad1acdf240a67955

.flowconfig

@@ -33,7 +33,6 @@ experimental.strict_type_args=true
 
 munge_underscores=true
 
-module.name_mapper='^image![a-zA-Z0-9$_-]+$' -> 'GlobalImageStub'
 module.name_mapper='^[./a-zA-Z0-9$_-]+\.\(bmp\|gif\|jpg\|jpeg\|png\|psd\|svg\|webp\|m4v\|mov\|mp4\|mpeg\|mpg\|webm\|aac\|aiff\|caf\|m4a\|mp3\|wav\|html\|pdf\)$' -> 'RelativeImageStub'
 
 suppress_type=$FlowIssue

jest-preset.json

@@ -7,7 +7,6 @@
     ]
   },
   "moduleNameMapper": {
-    "^image![a-zA-Z0-9$_-]+$": "GlobalImageStub",
     "^[./a-zA-Z0-9$_-]+\\.(bmp|gif|jpg|jpeg|png|psd|svg|webp)$": "RelativeImageStub",
     "^React$": "<rootDir>node_modules/react"
   },

local-cli/bundle/buildBundle.js

@@ -51,7 +51,6 @@ function buildBundle(args, config, output = outputBundle, packagerInstance) {
     const options = {
       projectRoots: config.getProjectRoots(),
       assetExts: defaultAssetExts.concat(assetExts),
-      assetRoots: config.getAssetRoots(),
       blacklistRE: config.getBlacklistRE(),
       getTransformOptionsModulePath: config.getTransformOptionsModulePath,
       transformModulePath: transformModulePath,

local-cli/bundle/saveAssets.js

@@ -31,7 +31,6 @@ function saveAssets(
 
   const filesToCopy = Object.create(null); // Map src -> dest
   assets
-    .filter(asset => !asset.deprecated)
     .forEach(asset =>
       asset.scales.forEach((scale, idx) => {
         const src = asset.files[idx];

local-cli/default.config.js

@@ -20,22 +20,11 @@ var rnpmConfig = require('./core/config');
  * to tweak.
  */
 var config = {
-  getProjectRoots() {
-    return getRoots();
-  },
+  getProjectRoots,
 
   getProjectConfig: rnpmConfig.getProjectConfig,
   getDependencyConfig: rnpmConfig.getDependencyConfig,
 
-  /**
-   * Specify where to look for assets that are referenced using
-   * `image!<image_name>`. Asset directories for images referenced using
-   * `./<image.extension>` don't require any entry in here.
-   */
-  getAssetRoots() {
-    return getRoots();
-  },
-
   /**
    * Specify any additional asset extentions to be used by the packager.
    * For example, if you want to include a .ttf file, you would return ['ttf']
@@ -62,7 +51,7 @@ var config = {
   },
 };
 
-function getRoots() {
+function getProjectRoots() {
   var root = process.env.REACT_NATIVE_APP_ROOT;
   if (root) {
     return [path.resolve(root)];

local-cli/dependencies/dependencies.js

@@ -27,7 +27,6 @@ function dependencies(argv, config, args, packagerInstance) {
 
   const packageOpts = {
     projectRoots: config.getProjectRoots(),
-    assetRoots: config.getAssetRoots(),
     blacklistRE: config.getBlacklistRE(),
     getTransformOptionsModulePath: config.getTransformOptionsModulePath,
     transformModulePath: transformModulePath,

local-cli/server/runServer.js

@@ -87,7 +87,6 @@ function getPackagerServer(args, config) {
 
   return ReactPackager.createServer({
     assetExts: defaultAssetExts.concat(args.assetExts),
-    assetRoots: args.assetRoots,
     blacklistRE: config.getBlacklistRE(),
     cacheVersion: '3',
     extraNodeModules: config.extraNodeModules,

local-cli/server/server.js

@@ -91,11 +91,6 @@ module.exports = {
     description: 'override the root(s) to be used by the packager',
     parse: (val) => val.split(','),
     default: (config) => config.getProjectRoots(),
-  }, {
-    command: '--assetRoots [list]',
-    description: 'specify the root directories of app assets',
-    parse: (val) => val.split(',').map(dir => path.resolve(process.cwd(), dir)),
-    default: (config) => config.getAssetRoots(),
   }, {
     command: '--assetExts [list]',
     description: 'Specify any additional asset extentions to be used by the packager',

local-cli/server/util/attachHMRServer.js

@@ -47,7 +47,7 @@ function attachHMRServer({httpServer, path, packagerServer}) {
       // `{path: '/a/b/c.js', deps: ['modA', 'modB', ...]}`
       return Promise.all(Object.values(response.dependencies).map(dep => {
         return dep.getName().then(depName => {
-          if (dep.isAsset() || dep.isAsset_DEPRECATED() || dep.isJSON()) {
+          if (dep.isAsset() || dep.isJSON()) {
             return Promise.resolve({path: dep.path, deps: []});
           }
           return packagerServer.getShallowDependencies({

local-cli/templates/HelloWorld/_flowconfig

@@ -28,7 +28,6 @@ experimental.strict_type_args=true
 
 munge_underscores=true
 
-module.name_mapper='^image![a-zA-Z0-9$_-]+$' -> 'GlobalImageStub'
 module.name_mapper='^[./a-zA-Z0-9$_-]+\.\(bmp\|gif\|jpg\|jpeg\|png\|psd\|svg\|webp\|m4v\|mov\|mp4\|mpeg\|mpg\|webm\|aac\|aiff\|caf\|m4a\|mp3\|wav\|html\|pdf\)$' -> 'RelativeImageStub'
 
 suppress_type=$FlowIssue

local-cli/util/Config.js

@@ -23,7 +23,6 @@ export type ConfigT = {
   getTransformOptionsModulePath?: () => string,
   transformVariants?: () => {[name: string]: Object},
 
-  getAssetRoots(): Array<string>,
   getBlacklistRE(): RegExp,
   getProjectRoots(): Array<string>,
 };

package.json

@@ -21,7 +21,6 @@
     "timers": "fake",
     "moduleNameMapper": {
       "^React$": "<rootDir>/Libraries/react-native/React.js",
-      "^image![a-zA-Z0-9$_-]+$": "GlobalImageStub",
       "^[./a-zA-Z0-9$_-]+\\.png$": "RelativeImageStub"
     },
     "testPathIgnorePatterns": [

packager/README.md

@@ -117,7 +117,7 @@ Builds a bundle according to the provided options.
 #### `bundleOptions`
 
 * `entryFile` string (required): the entry file of the bundle, relative to one
-  of the asset roots.
+  of the roots.
 * `dev` boolean (defaults to `true`): sets a global `__DEV__` variable
   which will effect how the React Native core libraries behave.
 * `minify` boolean: Whether to minify code and apply production optimizations.

packager/react-packager/src/Bundler/__tests__/Bundler-test.js

@@ -38,7 +38,6 @@ describe('Bundler', function() {
     id,
     dependencies,
     isAsset,
-    isAsset_DEPRECATED,
     isJSON,
     isPolyfill,
     resolution,
@@ -50,7 +49,6 @@ describe('Bundler', function() {
       getName: () => Promise.resolve(id),
       isJSON: () => isJSON,
       isAsset: () => isAsset,
-      isAsset_DEPRECATED: () => isAsset_DEPRECATED,
       isPolyfill: () => isPolyfill,
       read: () => ({
         code: 'arbitrary',
@@ -100,13 +98,6 @@ describe('Bundler', function() {
     modules = [
       createModule({id: 'foo', path: '/root/foo.js', dependencies: []}),
       createModule({id: 'bar', path: '/root/bar.js', dependencies: []}),
-      createModule({
-        path: '/root/img/img.png',
-        id: 'image!img',
-        isAsset_DEPRECATED: true,
-        dependencies: [],
-        resolution: 2,
-      }),
       createModule({
         id: 'new_image.png',
         path: '/root/img/new_image.png',
@@ -166,9 +157,8 @@ describe('Bundler', function() {
 
         expect(ithAddedModule(0)).toEqual('/root/foo.js');
         expect(ithAddedModule(1)).toEqual('/root/bar.js');
-        expect(ithAddedModule(2)).toEqual('/root/img/img.png');
-        expect(ithAddedModule(3)).toEqual('/root/img/new_image.png');
-        expect(ithAddedModule(4)).toEqual('/root/file.json');
+        expect(ithAddedModule(2)).toEqual('/root/img/new_image.png');
+        expect(ithAddedModule(3)).toEqual('/root/file.json');
 
         expect(bundle.finalize.mock.calls[0]).toEqual([{
             runMainModule: true,
@@ -177,15 +167,6 @@ describe('Bundler', function() {
         }]);
 
         expect(bundle.addAsset.mock.calls[0]).toEqual([{
-          __packager_asset: true,
-          path: '/root/img/img.png',
-          uri: 'img',
-          width: 25,
-          height: 50,
-          deprecated: true,
-        }]);
-
-        expect(bundle.addAsset.mock.calls[1]).toEqual([{
           __packager_asset: true,
           fileSystemLocation: '/root/img',
           httpServerLocation: '/assets/img',
@@ -245,7 +226,7 @@ describe('Bundler', function() {
       sourceMapUrl: 'source_map_url',
       assetPlugins: ['mockPlugin1', 'asyncMockPlugin2'],
     }).then(bundle => {
-      expect(bundle.addAsset.mock.calls[1]).toEqual([{
+      expect(bundle.addAsset.mock.calls[0]).toEqual([{
         __packager_asset: true,
         fileSystemLocation: '/root/img',
         httpServerLocation: '/assets/img',
@@ -334,7 +315,6 @@ describe('Bundler', function() {
         .then((paths) => expect(paths).toEqual([
           '/root/foo.js',
           '/root/bar.js',
-          '/root/img/img.png',
           '/root/img/new_image.png',
           '/root/img/new_image@2x.png',
           '/root/img/new_image@3x.png',

packager/react-packager/src/Bundler/index.js

@@ -79,10 +79,6 @@ const validateOpts = declareOpts({
     type: 'object',
     required: false,
   },
-  assetRoots: {
-    type: 'array',
-    required: false,
-  },
   assetExts: {
     type: 'array',
     default: ['png'],
@@ -120,7 +116,6 @@ type Options = {
   resetCache: boolean,
   transformModulePath: string,
   extraNodeModules: {},
-  assetRoots: Array<string>,
   assetExts: Array<string>,
   watch: boolean,
   assetServer: AssetServer,
@@ -182,7 +177,6 @@ class Bundler {
 
     this._resolver = new Resolver({
       assetExts: opts.assetExts,
-      assetRoots: opts.assetRoots,
       blacklistRE: opts.blacklistRE,
       cache: this._cache,
       extraNodeModules: opts.extraNodeModules,
@@ -603,10 +597,7 @@ class Bundler {
     let moduleTransport;
     const moduleId = getModuleId(module);
 
-    if (module.isAsset_DEPRECATED()) {
-      moduleTransport =
-        this._generateAssetModule_DEPRECATED(bundle, module, moduleId);
-    } else if (module.isAsset()) {
+    if (module.isAsset()) {
       moduleTransport = this._generateAssetModule(
         bundle, module, moduleId, assetPlugins, transformOptions.platform);
     }
@@ -639,38 +630,6 @@ class Bundler {
     });
   }
 
-  _generateAssetModule_DEPRECATED(bundle, module, moduleId) {
-    return Promise.all([
-      sizeOf(module.path),
-      module.getName(),
-    ]).then(([dimensions, id]) => {
-      const img = {
-        __packager_asset: true,
-        path: module.path,
-        uri: id.replace(/^[^!]+!/, ''),
-        width: dimensions.width / module.resolution,
-        height: dimensions.height / module.resolution,
-        deprecated: true,
-      };
-
-      bundle.addAsset(img);
-
-      const code =
-        'module.exports=' +
-        JSON.stringify(filterObject(img, assetPropertyBlacklist))
-        + ';';
-
-      return new ModuleTransport({
-        name: id,
-        id: moduleId,
-        code: code,
-        sourceCode: code,
-        sourcePath: module.path,
-        virtual: true,
-      });
-    });
-  }
-
   _generateAssetObjAndCode(module, assetPlugins, platform: mixed = null) {
     const relPath = getPathRelativeToRoot(this._projectRoots, module.path);
     var assetUrlPath = joinPath('/assets', pathDirname(relPath));

packager/react-packager/src/ModuleGraph/node-haste/node-haste.flow.js

@@ -54,19 +54,6 @@ export type FastFS = {
   matches(directory: Path, pattern: RegExp): Array<Path>,
 };
 
-type DeprecatedAssetMapOptions = {|
-  assetExts: Extensions,
-  files: Array<Path>,
-  helpers: DependencyGraphHelpers,
-  platforms: Platforms,
-|};
-
-declare class DeprecatedAssetMap {
-  // node-haste/DependencyGraph/DeprecatedAssetMap.js
-  constructor(options: DeprecatedAssetMapOptions): void,
-}
-export type DeprecatedAssetMapT = DeprecatedAssetMap;
-
 type HasteMapOptions = {|
   allowRelativePaths: boolean,
   extensions: Extensions,
@@ -89,7 +76,6 @@ type ResolutionRequestOptions = {|
   platforms: Platforms,
   preferNativePlatform: true,
   hasteMap: HasteMap,
-  deprecatedAssetMap: DeprecatedAssetMap,
   helpers: DependencyGraphHelpers,
   moduleCache: ModuleCache,
   fastfs: FastFS,

packager/react-packager/src/ModuleGraph/node-haste/node-haste.js

@@ -12,7 +12,6 @@
  'use strict';
 
 import type { // eslint-disable-line sort-requires
-  DeprecatedAssetMapT,
   Extensions,
   HasteMapT,
   Path,
@@ -25,7 +24,6 @@ import type {
 } from '../types.flow';
 
 const DependencyGraphHelpers = require('../../node-haste/DependencyGraph/DependencyGraphHelpers');
-const DeprecatedAssetMap: Class<DeprecatedAssetMapT> = require('../../node-haste/DependencyGraph/DeprecatedAssetMap');
 const FastFS = require('./FastFS');
 const HasteMap: Class<HasteMapT> = require('../../node-haste/DependencyGraph/HasteMap');
 const Module = require('./Module');
@@ -58,12 +56,6 @@ exports.createResolveFn = function(options: ResolveOptions): ResolveFn {
     assetExts,
     providesModuleNodeModules: defaults.providesModuleNodeModules,
   });
-  const deprecatedAssetMap = new DeprecatedAssetMap({
-    assetExts,
-    files,
-    helpers,
-    platforms,
-  });
 
   const fastfs = new FastFS(files);
   const moduleCache = new ModuleCache(fastfs, getTransformedFile);
@@ -83,7 +75,6 @@ exports.createResolveFn = function(options: ResolveOptions): ResolveFn {
     let resolutionRequest = resolutionRequests[platform];
     if (!resolutionRequest) {
       resolutionRequest = resolutionRequests[platform] = new ResolutionRequest({
-        deprecatedAssetMap,
         extraNodeModules,
         fastfs,
         hasteMap,

packager/react-packager/src/Resolver/index.js

@@ -31,10 +31,6 @@ const validateOpts = declareOpts({
     type: 'string',
     default: 'haste',
   },
-  assetRoots: {
-    type: 'array',
-    default: [],
-  },
   watch: {
     type: 'boolean',
     default: false,
@@ -92,7 +88,6 @@ class Resolver {
 
     this._depGraph = new DependencyGraph({
       roots: opts.projectRoots,
-      assetRoots_DEPRECATED: opts.assetRoots,
       assetExts: opts.assetExts,
       ignoreFilePath: function(filepath) {
         return filepath.indexOf('__tests__') !== -1 ||