create-video 3.3.39 → 3.3.40

package/dist/index.d.ts

@@ -1,5 +1,6 @@
 export declare const CreateVideoInternals: {
     FEATURED_TEMPLATES: import("./templates").Template[];
+    listOfRemotionPackages: string[];
 };
 export { Template } from './templates';
 declare const _default: () => never;

package/dist/index.js

@@ -1,9 +1,11 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.CreateVideoInternals = void 0;
+const list_of_remotion_packages_1 = require("./list-of-remotion-packages");
 const templates_1 = require("./templates");
 exports.CreateVideoInternals = {
     FEATURED_TEMPLATES: templates_1.FEATURED_TEMPLATES,
+    listOfRemotionPackages: list_of_remotion_packages_1.listOfRemotionPackages,
 };
 exports.default = () => {
     throw new Error('create-video is a CLI tool only. Run `npm init video`, `pnpm create video` or `yarn create video` instead!');

package/dist/init.js

@@ -94,7 +94,7 @@ const init = async () => {
             repoName: selectedTemplate.repoName,
             dest: projectRoot,
         });
-        (0, patch_readme_1.patchReadmeMd)(projectRoot, pkgManager);
+        (0, patch_readme_1.patchReadmeMd)(projectRoot, pkgManager, selectedTemplate);
         const latestVersion = await latestRemotionVersionPromise;
         (0, patch_package_json_1.patchPackageJson)({
             projectRoot,

package/dist/list-of-remotion-packages.d.ts

@@ -0,0 +1 @@
+export declare const listOfRemotionPackages: string[];

package/dist/list-of-remotion-packages.js

@@ -0,0 +1,25 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.listOfRemotionPackages = void 0;
+exports.listOfRemotionPackages = [
+    '@remotion/bundler',
+    '@remotion/cli',
+    '@remotion/eslint-config',
+    '@remotion/eslint-plugin',
+    '@remotion/renderer',
+    '@remotion/skia',
+    '@remotion/lottie',
+    '@remotion/media-utils',
+    '@remotion/motion-blur',
+    '@remotion/google-fonts',
+    '@remotion/noise',
+    '@remotion/paths',
+    '@remotion/babel-loader',
+    '@remotion/lambda',
+    '@remotion/player',
+    '@remotion/preload',
+    '@remotion/three',
+    '@remotion/gif',
+    '@remotion/shapes',
+    'remotion',
+];

package/dist/patch-package-json.d.ts

@@ -1,5 +1,4 @@
 import type { PackageManager } from './pkg-managers';
-export declare const listOfRemotionPackages: string[];
 export declare const patchPackageJson: ({ projectRoot, projectName, latestRemotionVersion, packageManager, }: {
     projectRoot: string;
     projectName: string;

package/dist/patch-package-json.js

@@ -3,29 +3,10 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.patchPackageJson = exports.listOfRemotionPackages = void 0;
+exports.patchPackageJson = void 0;
 const fs_1 = __importDefault(require("fs"));
 const path_1 = __importDefault(require("path"));
-exports.listOfRemotionPackages = [
-    '@remotion/bundler',
-    '@remotion/cli',
-    '@remotion/eslint-config',
-    '@remotion/renderer',
-    '@remotion/skia',
-    '@remotion/lottie',
-    '@remotion/media-utils',
-    '@remotion/motion-blur',
-    '@remotion/google-fonts',
-    '@remotion/noise',
-    '@remotion/paths',
-    '@remotion/babel-loader',
-    '@remotion/lambda',
-    '@remotion/player',
-    '@remotion/preload',
-    '@remotion/three',
-    '@remotion/gif',
-    'remotion',
-];
+const list_of_remotion_packages_1 = require("./list-of-remotion-packages");
 const patchPackageJson = ({ projectRoot, projectName, latestRemotionVersion, packageManager, }, { getPackageJson = (filename) => fs_1.default.readFileSync(filename, 'utf-8'), setPackageJson = (filename, content) => fs_1.default.writeFileSync(filename, content), } = {}) => {
     const fileName = path_1.default.join(projectRoot, 'package.json');
     const contents = getPackageJson(fileName);
@@ -33,7 +14,7 @@ const patchPackageJson = ({ projectRoot, projectName, latestRemotionVersion, pac
     const { name, dependencies, ...others } = packageJson;
     const newDependencies = Object.keys(dependencies)
         .map((d) => {
-        if (exports.listOfRemotionPackages.includes(d)) {
+        if (list_of_remotion_packages_1.listOfRemotionPackages.includes(d)) {
             return [d, latestRemotionVersion];
         }
         return [d, dependencies[d]];

package/dist/patch-readme.d.ts

@@ -1,2 +1,3 @@
 import type { PackageManager } from './pkg-managers';
-export declare const patchReadmeMd: (projectRoot: string, packageManager: PackageManager) => void;
+import type { Template } from './templates';
+export declare const patchReadmeMd: (projectRoot: string, packageManager: PackageManager, template: Template) => void;

package/dist/patch-readme.js

@@ -7,7 +7,7 @@ exports.patchReadmeMd = void 0;
 const fs_1 = __importDefault(require("fs"));
 const path_1 = __importDefault(require("path"));
 const pkg_managers_1 = require("./pkg-managers");
-const patchReadmeMd = (projectRoot, packageManager) => {
+const patchReadmeMd = (projectRoot, packageManager, template) => {
     const fileName = path_1.default.join(projectRoot, 'README.md');
     const contents = fs_1.default.readFileSync(fileName, 'utf8');
     const newContents = contents
@@ -17,7 +17,7 @@ const patchReadmeMd = (projectRoot, packageManager) => {
             return (0, pkg_managers_1.getInstallCommand)(packageManager);
         }
         if (c.startsWith('npm start')) {
-            return (0, pkg_managers_1.getStartCommand)(packageManager);
+            return (0, pkg_managers_1.getDevCommand)(packageManager, template);
         }
         if (c.startsWith('npm run build')) {
             return (0, pkg_managers_1.getRenderCommand)(packageManager);

package/dist/pkg-managers.d.ts

@@ -4,7 +4,6 @@ export declare const selectPackageManager: () => PackageManager;
 export declare const getInstallCommand: (manager: PackageManager) => "yarn" | "npm i" | "pnpm i" | undefined;
 export declare const getDevCommand: (manager: PackageManager, template: Template) => string | undefined;
 export declare const getRenderCommandForTemplate: (manager: PackageManager, template: Template) => string | undefined;
-export declare const getStartCommand: (manager: PackageManager) => "npm start" | "yarn start" | "pnpm start" | undefined;
 export declare const getRenderCommand: (manager: PackageManager) => "npm run build" | "yarn build" | "pnpm build" | undefined;
 export declare const getRunCommand: (manager: PackageManager) => "npm run" | "yarn run" | "pnpm run";
 export declare const getPackageManagerVersion: (manager: PackageManager) => Promise<string>;

package/dist/pkg-managers.js

@@ -3,7 +3,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.getPackageManagerVersionOrNull = exports.getPackageManagerVersion = exports.getRunCommand = exports.getRenderCommand = exports.getStartCommand = exports.getRenderCommandForTemplate = exports.getDevCommand = exports.getInstallCommand = exports.selectPackageManager = void 0;
+exports.getPackageManagerVersionOrNull = exports.getPackageManagerVersion = exports.getRunCommand = exports.getRenderCommand = exports.getRenderCommandForTemplate = exports.getDevCommand = exports.getInstallCommand = exports.selectPackageManager = void 0;
 const child_process_1 = require("child_process");
 const path_1 = __importDefault(require("path"));
 const shouldUseYarn = () => {
@@ -49,14 +49,14 @@ const getInstallCommand = (manager) => {
 };
 exports.getInstallCommand = getInstallCommand;
 const getDevCommand = (manager, template) => {
-    if (template.cliId === 'remix') {
+    if (template.cliId === 'remix' || template.cliId === 'next') {
         return `${(0, exports.getRunCommand)(manager)} dev`;
     }
-    return (0, exports.getStartCommand)(manager);
+    return getStartCommand(manager);
 };
 exports.getDevCommand = getDevCommand;
 const getRenderCommandForTemplate = (manager, template) => {
-    if (template.cliId === 'remix') {
+    if (template.cliId === 'remix' || template.cliId === 'next') {
         return `${(0, exports.getRunCommand)(manager)} remotion:render`;
     }
     if (template.cliId === 'still') {
@@ -76,7 +76,6 @@ const getStartCommand = (manager) => {
         return `pnpm start`;
     }
 };
-exports.getStartCommand = getStartCommand;
 const getRenderCommand = (manager) => {
     if (manager === 'npm') {
         return `npm run build`;

package/dist/templates.d.ts

@@ -21,7 +21,7 @@ export declare type Template = {
     repoName: string;
     homePageLabel: string;
     longerDescription: React.ReactNode;
-    cliId: 'hello-world' | 'javascript' | 'blank' | 'remix' | 'three' | 'still' | 'tts' | 'audiogram' | 'skia' | 'tailwind' | 'overlay';
+    cliId: 'hello-world' | 'javascript' | 'blank' | 'next' | 'remix' | 'three' | 'still' | 'tts' | 'audiogram' | 'skia' | 'tailwind' | 'overlay';
     defaultBranch: string;
 } & DynamicTemplate;
 export declare const FEATURED_TEMPLATES: Template[];

package/dist/templates.js

@@ -2,13 +2,35 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.FEATURED_TEMPLATES = void 0;
 const jsx_runtime_1 = require("react/jsx-runtime");
+function truthy(value) {
+    return Boolean(value);
+}
+const ENABLE_NEXT = false;
+const nextTemplate = {
+    homePageLabel: 'Next.js',
+    shortName: 'Next.js',
+    org: 'remotion-dev',
+    repoName: 'template-next',
+    description: 'SaaS template for video generation apps',
+    longerDescription: 'A software-as-a-service starter kit which has the Remotion Player and rendering via Remotion Lambda built-in. Our recommended choice for people who want to build a video generation app.',
+    promoBanner: {
+        width: 1280,
+        height: 720,
+        // TODO: Update this image
+        src: '/img/remix-template.png',
+    },
+    cliId: 'next',
+    type: 'image',
+    defaultBranch: 'main',
+};
+// Note that this page is statically analyzed by extract-articles.mjs
 exports.FEATURED_TEMPLATES = [
     {
-        homePageLabel: 'TypeScript',
+        homePageLabel: 'Hello World',
         shortName: 'Hello World',
         org: 'remotion-dev',
         repoName: 'template-helloworld',
-        description: 'The default starter template (recommended)',
+        description: 'A "Hello World" starter template',
         longerDescription: 'A basic template with TypeScript, Prettier and ESLint preconfigured. Our recommended choice for beginners.',
         promoVideo: {
             muxId: 'vKvV6aa7GXGlR01cmpc6J8Zz4Gkj9d2hBSnVYoef00900I',
@@ -19,22 +41,7 @@ exports.FEATURED_TEMPLATES = [
         type: 'video',
         defaultBranch: 'main',
     },
-    {
-        homePageLabel: 'JavaScript',
-        shortName: 'Hello World (JavaScript)',
-        org: 'remotion-dev',
-        repoName: 'template-helloworld-javascript',
-        description: 'The default starter template in plain JS',
-        longerDescription: 'The Hello World template, but in plain JavaScript. Recommended for people who detest TypeScript.',
-        promoVideo: {
-            muxId: 'dRIuc00f8QWnKedM8GBGPqXJWqU01DPJFgPTHpJgixxas',
-            width: 1920,
-            height: 1080,
-        },
-        cliId: 'javascript',
-        type: 'video',
-        defaultBranch: 'main',
-    },
+    ENABLE_NEXT ? nextTemplate : null,
     {
         homePageLabel: 'Blank',
         shortName: 'Blank',
@@ -51,6 +58,22 @@ exports.FEATURED_TEMPLATES = [
         type: 'video',
         defaultBranch: 'main',
     },
+    {
+        homePageLabel: 'JavaScript',
+        shortName: 'Hello World (JavaScript)',
+        org: 'remotion-dev',
+        repoName: 'template-helloworld-javascript',
+        description: 'The default starter template in plain JS',
+        longerDescription: 'The Hello World template, but in plain JavaScript. Recommended for people who detest TypeScript.',
+        promoVideo: {
+            muxId: 'dRIuc00f8QWnKedM8GBGPqXJWqU01DPJFgPTHpJgixxas',
+            width: 1920,
+            height: 1080,
+        },
+        cliId: 'javascript',
+        type: 'video',
+        defaultBranch: 'main',
+    },
     {
         homePageLabel: 'Remix',
         shortName: 'Remix',
@@ -100,7 +123,7 @@ exports.FEATURED_TEMPLATES = [
         defaultBranch: 'main',
     },
     {
-        homePageLabel: 'TTS',
+        homePageLabel: 'Text-To-Speech',
         shortName: 'Text To Speech',
         org: 'FelippeChemello',
         repoName: 'Remotion-TTS-Example',
@@ -179,4 +202,4 @@ exports.FEATURED_TEMPLATES = [
         type: 'video',
         defaultBranch: 'main',
     },
-];
+].filter(truthy);

package/dist/test/validate-templates.test.js

@@ -9,77 +9,102 @@ const templates_1 = require("../templates");
 const getFileForTemplate = (template, file) => {
     return `https://github.com/${template.org}/${template.repoName}/raw/${template.defaultBranch}/${file}`;
 };
-for (const template of templates_1.FEATURED_TEMPLATES) {
-    (0, vitest_1.test)(template.shortName + ' should have a valid package.json', async () => {
-        var _a, _b;
-        const packageJson = getFileForTemplate(template, 'package.json');
-        const res = await (0, got_1.default)(packageJson, {
-            throwHttpErrors: false,
-            cache: false,
-            followRedirect: true,
-        });
-        (0, vitest_1.expect)(res.statusCode).toBe(200);
-        const body = JSON.parse(res.body);
-        if (!template.shortName.includes('Remix') &&
-            !template.shortName.includes('Still')) {
-            (0, vitest_1.expect)(body.scripts.build).toMatch(/render/);
-            (0, vitest_1.expect)(body.scripts.build).not.toContain('index');
-        }
-        (0, vitest_1.expect)(body.dependencies.remotion).toMatch(/^\^?3/);
-        (0, vitest_1.expect)(body.dependencies['@remotion/cli']).toMatch(/^\^?3/);
-        (0, vitest_1.expect)(body.dependencies.react).toMatch(/^\^?18/);
-        (0, vitest_1.expect)(body.dependencies['react-dom']).toMatch(/^\^?18/);
-        (0, vitest_1.expect)(body.devDependencies.prettier).toMatch(/^\^?2.8.1/);
-        (0, vitest_1.expect)(body.devDependencies.eslint).toMatch(/^\^?8.30/);
-        const eitherPluginOrConfig = ((_a = body.devDependencies['@remotion/eslint-config']) === null || _a === void 0 ? void 0 : _a.match(/^\^?3/)) ||
-            ((_b = body.devDependencies['@remotion/eslint-plugin']) === null || _b === void 0 ? void 0 : _b.match(/^\^?3/));
-        (0, vitest_1.expect)(eitherPluginOrConfig).toBeTruthy();
-        if (!template.shortName.includes('JavaScript')) {
-            (0, vitest_1.expect)(body.devDependencies.typescript).toMatch(/^\^?4/);
-        }
-    }, 12000);
-    (0, vitest_1.test)(template.shortName + ' should not have a package-lock.json', async () => {
-        const packageLockJson = getFileForTemplate(template, 'package-lock.json');
-        const res = await (0, got_1.default)(packageLockJson, {
-            throwHttpErrors: false,
-        });
-        (0, vitest_1.expect)(res.statusCode).toBe(404);
-    }, 12000);
-    (0, vitest_1.test)(template.shortName + ' should not have a yarn.lock', async () => {
-        const packageLockJson = getFileForTemplate(template, 'yarn.lock');
-        const res = await (0, got_1.default)(packageLockJson, {
-            throwHttpErrors: false,
-        });
-        (0, vitest_1.expect)(res.statusCode).toBe(404);
-    }, 12000);
-    (0, vitest_1.test)(template.shortName + ' should not have a pnpm-lock.yaml', async () => {
-        const packageLockJson = getFileForTemplate(template, 'pnpm-lock.yaml');
-        const res = await (0, got_1.default)(packageLockJson, {
-            throwHttpErrors: false,
-        });
-        (0, vitest_1.expect)(res.statusCode).toBe(404);
-    }, 12000);
-    (0, vitest_1.test)(template.shortName + ' should not have a standard entry point', async () => {
-        const { contents, entryPoint } = await findFile([
-            getFileForTemplate(template, 'src/index.ts'),
-            getFileForTemplate(template, 'src/index.js'),
-            getFileForTemplate(template, 'remotion/index.ts'),
-            getFileForTemplate(template, 'app/remotion/index.ts'),
-        ]);
-        (0, vitest_1.expect)(entryPoint).toBeTruthy();
-        (0, vitest_1.expect)(contents).toMatch(/RemotionRoot/);
-    }, 12000);
-    (0, vitest_1.test)(template.shortName + ' should not have a standard Root file', async () => {
-        const { contents, entryPoint } = await findFile([
-            getFileForTemplate(template, 'src/Root.tsx'),
-            getFileForTemplate(template, 'src/Root.jsx'),
-            getFileForTemplate(template, 'remotion/Root.tsx'),
-            getFileForTemplate(template, 'app/remotion/Root.tsx'),
-        ]);
-        (0, vitest_1.expect)(entryPoint).toBeTruthy();
-        (0, vitest_1.expect)(contents).toMatch(/export const RemotionRoot/);
-    }, 12000);
-}
+(0, vitest_1.describe)('Templates should be valid', () => {
+    for (const template of templates_1.FEATURED_TEMPLATES) {
+        (0, vitest_1.it)(template.shortName + ' should have a valid package.json', async () => {
+            var _a, _b;
+            const packageJson = getFileForTemplate(template, 'package.json');
+            const res = await (0, got_1.default)(packageJson, {
+                throwHttpErrors: false,
+                cache: false,
+                followRedirect: true,
+            });
+            (0, vitest_1.expect)(res.statusCode).toBe(200);
+            const body = JSON.parse(res.body);
+            if (!template.shortName.includes('Remix') &&
+                !template.shortName.includes('Still')) {
+                (0, vitest_1.expect)(body.scripts.build).toMatch(/render/);
+                (0, vitest_1.expect)(body.scripts.build).not.toContain('index');
+            }
+            (0, vitest_1.expect)(body.dependencies.remotion).toMatch(/^\^?3/);
+            (0, vitest_1.expect)(body.dependencies['@remotion/cli']).toMatch(/^\^?3/);
+            (0, vitest_1.expect)(body.dependencies.react).toMatch(/^\^?18/);
+            (0, vitest_1.expect)(body.dependencies['react-dom']).toMatch(/^\^?18/);
+            (0, vitest_1.expect)(body.devDependencies.prettier).toMatch(/^\^?2.8.1/);
+            (0, vitest_1.expect)(body.devDependencies.eslint).toMatch(/^\^?8.30/);
+            const eitherPluginOrConfig = ((_a = body.devDependencies['@remotion/eslint-config']) === null || _a === void 0 ? void 0 : _a.match(/^\^?3/)) ||
+                ((_b = body.devDependencies['@remotion/eslint-plugin']) === null || _b === void 0 ? void 0 : _b.match(/^\^?3/));
+            (0, vitest_1.expect)(eitherPluginOrConfig).toBeTruthy();
+            if (!template.shortName.includes('JavaScript')) {
+                (0, vitest_1.expect)(body.devDependencies.typescript).toMatch(/^\^?4/);
+            }
+        }, 12000);
+        (0, vitest_1.it)(template.shortName + ' should not have a package-lock.json', async () => {
+            const packageLockJson = getFileForTemplate(template, 'package-lock.json');
+            const res = await (0, got_1.default)(packageLockJson, {
+                throwHttpErrors: false,
+            });
+            (0, vitest_1.expect)(res.statusCode).toBe(404);
+        }, 12000);
+        (0, vitest_1.it)(template.shortName + ' should not have a yarn.lock', async () => {
+            const packageLockJson = getFileForTemplate(template, 'yarn.lock');
+            const res = await (0, got_1.default)(packageLockJson, {
+                throwHttpErrors: false,
+            });
+            (0, vitest_1.expect)(res.statusCode).toBe(404);
+        }, 12000);
+        (0, vitest_1.it)(template.shortName + ' should not have a pnpm-lock.yaml', async () => {
+            const packageLockJson = getFileForTemplate(template, 'pnpm-lock.yaml');
+            const res = await (0, got_1.default)(packageLockJson, {
+                throwHttpErrors: false,
+            });
+            (0, vitest_1.expect)(res.statusCode).toBe(404);
+        }, 12000);
+        (0, vitest_1.it)(template.shortName + ' should not have a standard entry point', async () => {
+            const { contents, entryPoint } = await findFile([
+                getFileForTemplate(template, 'src/index.ts'),
+                getFileForTemplate(template, 'src/index.js'),
+                getFileForTemplate(template, 'remotion/index.ts'),
+                getFileForTemplate(template, 'app/remotion/index.ts'),
+            ]);
+            (0, vitest_1.expect)(entryPoint).toBeTruthy();
+            (0, vitest_1.expect)(contents).toMatch(/RemotionRoot/);
+        }, 12000);
+        (0, vitest_1.it)(template.shortName + ' should not have a standard Root file', async () => {
+            const { contents, entryPoint } = await findFile([
+                getFileForTemplate(template, 'src/Root.tsx'),
+                getFileForTemplate(template, 'src/Root.jsx'),
+                getFileForTemplate(template, 'remotion/Root.tsx'),
+                getFileForTemplate(template, 'app/remotion/Root.tsx'),
+            ]);
+            (0, vitest_1.expect)(entryPoint).toBeTruthy();
+            (0, vitest_1.expect)(contents).toMatch(/export const RemotionRoot/);
+        }, 12000);
+        (0, vitest_1.it)(template.shortName + ' should not have a standard Root file', async () => {
+            const { contents, entryPoint } = await findFile([
+                getFileForTemplate(template, 'src/Root.tsx'),
+                getFileForTemplate(template, 'src/Root.jsx'),
+                getFileForTemplate(template, 'remotion/Root.tsx'),
+                getFileForTemplate(template, 'app/remotion/Root.tsx'),
+            ]);
+            (0, vitest_1.expect)(entryPoint).toBeTruthy();
+            (0, vitest_1.expect)(contents).toMatch(/export const RemotionRoot/);
+        }, 12000);
+        (0, vitest_1.it)(template.shortName + 'should use the new config file format', async () => {
+            const { contents, entryPoint } = await findFile([
+                getFileForTemplate(template, 'remotion.config.ts'),
+                getFileForTemplate(template, 'remotion.config.js'),
+            ]);
+            (0, vitest_1.expect)(entryPoint).toBeTruthy();
+            (0, vitest_1.expect)(contents).not.toContain('Config.Rendering');
+            (0, vitest_1.expect)(contents).not.toContain('Config.Bundling');
+            (0, vitest_1.expect)(contents).not.toContain('Config.Log');
+            (0, vitest_1.expect)(contents).not.toContain('Config.Puppeteer');
+            (0, vitest_1.expect)(contents).not.toContain('Config.Output');
+            (0, vitest_1.expect)(contents).not.toContain('Config.Preview');
+        }, 12000);
+    }
+});
 const findFile = async (options) => {
     let entryPoint = null;
     let contents = null;

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "create-video",
-	"version": "3.3.39",
+	"version": "3.3.40",
 	"description": "",
 	"main": "dist/index.js",
 	"bin": {
@@ -39,5 +39,5 @@
 		"typescript": "^4.7.0",
 		"vitest": "0.24.3"
 	},
-	"gitHead": "5a07260074fe3a6db2cdba0001503c665951414d"
+	"gitHead": "be5f606a81761f7f8e1e191ebabd5f8d225d8c09"
 }