スタティック/マーケティングサイト（非SPA）を使用したWebpack

スタティック/マーケティングサイトをいくつか作成する必要があり、webpackをモジュールバンドラとして使用したいと考えています。スタティック/マーケティングサイト（非SPA）を使用したWebpack

だから私はこのようなディレクトリ構造を考えていた：私は基本的にすべてのHTMLのために何をしたいです

build/ 
src/ 
    html/ 
    index.html 
    foo.html 
    bar.html 
    scss/ 
    main.scss 
    _partial1.scss 
    js/ 
    app.js 
    foo.js 
    fonts/ 
    fonta.ttf 
    images/ 
    img1.png 
    svg1.svg

だから私はhttps://github.com/kevlened/copy-webpack-pluginを使用することを考えていたこの

<html> 
    <head> 
    <link href="bundle.css" /> 
    </head> 
    <body> 
    <!-- html static content --> 
    <script src="bundle.js" /> 
    </body> 
</html>

のようなものを持っていることですsrc/htmlのファイルをbuildにコピーし、/buildにcss/jsを作成して、次のようなファイル構造にすることができます：

build/ 
    index.html 
    about.html 
    foo.html 
    bar.html 
    build.js 
    build.css

また、https://github.com/tapio/live-serverを使用してすべてを処理することを考えていたのは、build/です。言われて、私はどの.scss/.js/.htmlに行われたすべての変更は、このアプローチにbuild/フォルダ

思考にコピーされることを

？私は静的/マーケティングサイトを提供することが大丈夫だと思います。

ありがとうございます！

出典

2017-01-29 Alejandro Nanez

あなたがそのフォルダ構造にバインドされていない場合、私は別の使用します。

build/ 
html/ 
    index.html 
    foo.html 
    bar.html 
src/ 
    scss/ 
     main.scss 
     _partial1.scss 
    js/ 
     app.js 
     foo.js 
    fonts/ 
     fonta.ttf 
    images/ 
     img1.png 
     svg1.svg

そして、あなたは、単に書くことができ、あなたのHTMLファイル内に：

<html> 
    <head> 
     <link href="bundle/main.css" /> 
    </head> 
    <body> 
     <!-- html static content --> 
     <script src="bundle/app.js" /> 
    </body> 
</html>

だから、あなただけに必要バンドルされたJSとCSSファイルをbuildに生成し、webpackでバンドルするたびにHTMLファイルをコピーする必要はありません。

出典

2017-01-29 00:48:07 NonPolynomial

私は、自分のコードを追加するために 'src /'とは違う別のフォルダを持っているのを好きではありません。 'src/html'から' build'にhtmlを貼り付けるだけのメリットはないので、 'build /'フォルダー内でHTMLを動かすというアイデアは気に入っています。 –

しかし、HTMLファイルが静的であれば、あなたのhtmlを 'src'から' build'フォルダにコピーすることもできません – NonPolynomial

スタティック/マーケティングサイト（非SPA）を使用したWebpack

答えて

関連する問題