Bonjour,
J'ai integré vusjs + webpack + bootstrap-sass a symfony et le pb c'est qu'il me retourne :
[Thu Apr 13 20:54:03 2017] 127.0.0.1:57637 [404]: /node_modules/bootstrap-sass/assets/fonts/bootstrap/glyphicons-halflings-regular.woff2
[Thu Apr 13 20:54:03 2017] 127.0.0.1:57640 [404]: /node_modules/bootstrap-sass/assets/fonts/bootstrap/glyphicons-halflings-regular.woff
[Thu Apr 13 20:54:04 2017] 127.0.0.1:57643 [404]: /node_modules/bootstrap-sass/assets/fonts/bootstrap/glyphicons-halflings-regular.ttf
voici ma conf.base:
'use strict'
const path = require('path')
const webpack = require('webpack')
const config = require('./config')
const postcss = [
require('autoprefixer')({
browsers: ['last 2 versions', 'ie > 8']
}),
require("css-mqpacker")()
]
let webpack_base = {
entry: config.entry,
output: {
path: config.assets_path,
filename: '[name].js',
publicPath: config.assets_url
},
resolve: {
extensions: ['', '.js', '.vue', '.css', '.json'],
alias: {
root: path.join(__dirname, '../js'),
components: path.join(__dirname, '../js/components'),
vue: 'vue/dist/vue.js'
}
},
module: {
preLoaders: [
{
test: /\.vue$/,
loader: 'eslint',
exclude: [/node_modules/]
},
{
test: /\.js$/,
loader: 'eslint',
exclude: [/node_modules/,/libs/]
}
],
loaders: [
{
test: /\.vue$/,
loaders: ['vue']
},
{
test: /\.js$/,
loader: 'babel',
exclude: [/node_modules/, /libs/]
},
{
test: /\.scss$/,
vue: 'scss',
loaders: ['css', 'postcss', 'sass']
},
{
test: /\.css$/,
loaders: ['css', 'postcss']
}, {
test: /\.(png|jpe?g|gif|svg|woff2?|eot|ttf|otf|wav)(\?.*)?$/,
loader: 'url',
query: {
limit: 10,
name: '[name].[hash:7].[ext]'
}
}
]
},
babel: {
babelrc: false,
presets: [
'es2015',
'stage-2'
],
plugins: ["transform-runtime"]
},
postcss,
vue: {
loaders: {},
postcss
},
plugins: [],
devServer: {
headers: { "Access-Control-Allow-Origin": "*" }
}
}
if (config.html) {
const HtmlWebpackPlugin = require('html-webpack-plugin')
webpack_base.plugins.push(
new HtmlWebpackPlugin({
filename: 'index.html',
template: 'index.html',
inject: true
})
)
}
module.exports = webpack_base
Merci pour votre aide
Bonsoir,
Je dirais que le problème vient du fait que le serveur ne distribue pas le dossier node_modules
. On a deux solutions :
1) distribuer node_modules
.
2) copier les sources fonts dans un autre dossier et modifier le chemin dans bootstrap-sass.
Je pencherai pour la version 2.
Il le distribue car tu as cette règle
{
test: /\.scss$/,
vue: 'scss',
loaders: ['css', 'postcss', 'sass']
},
Celle ci lance la commande sass
qui va compiler ton fichier sass en css. Du coup l'import de bootstrap-sass va se retrouver dans le fichier CSS compilé qui, lui, est disponible.