ブログ

割とコンピュータよりの情報をお届けします。

vue-cliでインストールしたwebpackでnpm run buildで用意したコンテンツをCefSharpで使用

vue-cliでインストールしたwebpackでnpm run buildで用意したコンテンツをCefSharpで使用するときの注意点。

まずCefSharpの方だが,最近CefSharpのバージョンが65に上がったが概ねここに書いた記事のまま使用できる(というかまだパッケージ自体はAny CPU対応を謳っているが,これをインストールしただけでAny CPU対応の記述をプロジェクトファイルに追記していないと使えもしない状態が続いている)。

public partial class MainWindow : Window
    {
        public MainWindow()
        {
            InitializeComponent();

            var browser = new CefSharp.Wpf.ChromiumWebBrowser();
            // アドレスの取得
            String page = string.Format(@"{0}\dist\index.html", StartupPath);
            BrowserSettings browserSettings = new BrowserSettings();
            browserSettings.FileAccessFromFileUrls = CefState.Enabled;
            browserSettings.UniversalAccessFromFileUrls = CefState.Enabled;
            browser.BrowserSettings = browserSettings;
            // アドレス設定
            browser.BrowserSettings.AcceptLanguageList = "ja-JP";
            browser.Address = page;
            Content = browser;
        }

        // 実行ファイルのディレクトリ取得
        public string StartupPath
        {
            get
            {
                return System.IO.Path.GetDirectoryName(System.IO.Path.GetFullPath(Environment.GetCommandLineArgs()[0]));
            }
        }
    }

Windows Formsが必要ならここに書いた(差分が必要)。

そして,vue-cliでコンテンツを用意する方法だが,コマンドプロンプトでnpm run devを実行するとdistフォルダにコンテンツが生成されるが,ここにあるようにconfig/index.jsのbuildのオブジェクトのassetsPublicPathを'./'に変更する必要がある。

2018/07/29 コンピュータ   TakeMe
< 前の記事     一覧へ     後の記事 >

コメント送信フォーム


※ Eメールは公開されません
Loading...
 画像の文字を入力してください