forked from shibao/cannery
mix format
This commit is contained in:
parent
46ead41bce
commit
265bbcabc9
@ -1,6 +1,6 @@
|
|||||||
// We import the CSS which is extracted to its own file by esbuild.
|
// We import the CSS which is extracted to its own file by esbuild.
|
||||||
// Remove this line if you add a your own CSS build pipeline (e.g postcss).
|
// Remove this line if you add a your own CSS build pipeline (e.g postcss).
|
||||||
import "../css/app.scss"
|
import '../css/app.scss'
|
||||||
|
|
||||||
// If you want to use Phoenix channels, run `mix help phx.gen.channel`
|
// If you want to use Phoenix channels, run `mix help phx.gen.channel`
|
||||||
// to get started and then uncomment the line below.
|
// to get started and then uncomment the line below.
|
||||||
@ -20,23 +20,23 @@ import "../css/app.scss"
|
|||||||
//
|
//
|
||||||
|
|
||||||
// Include phoenix_html to handle method=PUT/DELETE in forms and buttons.
|
// Include phoenix_html to handle method=PUT/DELETE in forms and buttons.
|
||||||
import "phoenix_html"
|
import 'phoenix_html'
|
||||||
// Establish Phoenix Socket and LiveView configuration.
|
// Establish Phoenix Socket and LiveView configuration.
|
||||||
import {Socket} from "phoenix"
|
import { Socket } from 'phoenix'
|
||||||
import {LiveSocket} from "phoenix_live_view"
|
import { LiveSocket } from 'phoenix_live_view'
|
||||||
import topbar from "../vendor/topbar"
|
import topbar from '../vendor/topbar'
|
||||||
import MaintainAttrs from './maintain_attrs'
|
import MaintainAttrs from './maintain_attrs'
|
||||||
|
|
||||||
let csrfToken = document.querySelector("meta[name='csrf-token']").getAttribute("content")
|
const csrfToken = document.querySelector("meta[name='csrf-token']").getAttribute('content')
|
||||||
let liveSocket = new LiveSocket("/live", Socket, {
|
const liveSocket = new LiveSocket('/live', Socket, {
|
||||||
params: { _csrf_token: csrfToken },
|
params: { _csrf_token: csrfToken },
|
||||||
hooks: { MaintainAttrs }
|
hooks: { MaintainAttrs }
|
||||||
})
|
})
|
||||||
|
|
||||||
// Show progress bar on live navigation and form submits
|
// Show progress bar on live navigation and form submits
|
||||||
topbar.config({barColors: {0: "#29d"}, shadowColor: "rgba(0, 0, 0, .3)"})
|
topbar.config({ barColors: { 0: '#29d' }, shadowColor: 'rgba(0, 0, 0, .3)' })
|
||||||
window.addEventListener("phx:page-loading-start", info => topbar.show())
|
window.addEventListener('phx:page-loading-start', info => topbar.show())
|
||||||
window.addEventListener("phx:page-loading-stop", info => topbar.hide())
|
window.addEventListener('phx:page-loading-stop', info => topbar.hide())
|
||||||
|
|
||||||
// connect if there are any LiveViews on the page
|
// connect if there are any LiveViews on the page
|
||||||
liveSocket.connect()
|
liveSocket.connect()
|
||||||
|
@ -2,7 +2,7 @@
|
|||||||
// update. https://github.com/phoenixframework/phoenix_live_view/issues/1011
|
// update. https://github.com/phoenixframework/phoenix_live_view/issues/1011
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
attrs(){ return this.el.getAttribute("data-attrs").split(", ") },
|
attrs () { return this.el.getAttribute('data-attrs').split(', ') },
|
||||||
beforeUpdate(){ this.prevAttrs = this.attrs().map(name => [name, this.el.getAttribute(name)]) },
|
beforeUpdate () { this.prevAttrs = this.attrs().map(name => [name, this.el.getAttribute(name)]) },
|
||||||
updated(){ this.prevAttrs.forEach(([name, val]) => this.el.setAttribute(name, val)) }
|
updated () { this.prevAttrs.forEach(([name, val]) => this.el.setAttribute(name, val)) }
|
||||||
}
|
}
|
||||||
|
@ -1,7 +1,7 @@
|
|||||||
module.exports = {
|
module.exports = {
|
||||||
plugins: {
|
plugins: {
|
||||||
"postcss-import": {},
|
'postcss-import': {},
|
||||||
tailwindcss: {},
|
tailwindcss: {},
|
||||||
autoprefixer: {},
|
autoprefixer: {}
|
||||||
}
|
}
|
||||||
}
|
}
|
@ -7,7 +7,7 @@ module.exports = {
|
|||||||
'../lib/**/*.eex',
|
'../lib/**/*.eex',
|
||||||
'./js/**/*.js'
|
'./js/**/*.js'
|
||||||
],
|
],
|
||||||
darkMode: "media",
|
darkMode: 'media',
|
||||||
theme: {
|
theme: {
|
||||||
colors: {
|
colors: {
|
||||||
transparent: 'transparent',
|
transparent: 'transparent',
|
||||||
@ -20,15 +20,15 @@ module.exports = {
|
|||||||
gray: colors.trueGray,
|
gray: colors.trueGray,
|
||||||
indigo: colors.indigo,
|
indigo: colors.indigo,
|
||||||
red: colors.rose,
|
red: colors.rose,
|
||||||
yellow: colors.amber,
|
yellow: colors.amber
|
||||||
},
|
},
|
||||||
extend: {},
|
extend: {}
|
||||||
},
|
},
|
||||||
variants: {
|
variants: {
|
||||||
extend: {
|
extend: {
|
||||||
backgroundColor: ['active'],
|
backgroundColor: ['active'],
|
||||||
borderColor: ['active'],
|
borderColor: ['active']
|
||||||
},
|
}
|
||||||
},
|
},
|
||||||
plugins: [],
|
plugins: []
|
||||||
}
|
}
|
||||||
|
@ -1,12 +1,12 @@
|
|||||||
const path = require("path");
|
const path = require('path')
|
||||||
const glob = require("glob");
|
const glob = require('glob')
|
||||||
const MiniCssExtractPlugin = require("mini-css-extract-plugin");
|
const MiniCssExtractPlugin = require('mini-css-extract-plugin')
|
||||||
const TerserPlugin = require("terser-webpack-plugin");
|
const TerserPlugin = require('terser-webpack-plugin')
|
||||||
const CssMinimizerPlugin = require("css-minimizer-webpack-plugin");
|
const CssMinimizerPlugin = require('css-minimizer-webpack-plugin')
|
||||||
const CopyWebpackPlugin = require("copy-webpack-plugin");
|
const CopyWebpackPlugin = require('copy-webpack-plugin')
|
||||||
|
|
||||||
module.exports = (env, options) => {
|
module.exports = (env, options) => {
|
||||||
const devMode = options.mode !== "production";
|
const devMode = options.mode !== 'production'
|
||||||
|
|
||||||
return {
|
return {
|
||||||
optimization: {
|
optimization: {
|
||||||
@ -16,30 +16,30 @@ module.exports = (env, options) => {
|
|||||||
]
|
]
|
||||||
},
|
},
|
||||||
entry: {
|
entry: {
|
||||||
app: glob.sync("./vendor/**/*.js").concat(["./js/app.js"])
|
app: glob.sync('./vendor/**/*.js').concat(['./js/app.js'])
|
||||||
},
|
},
|
||||||
output: {
|
output: {
|
||||||
filename: "[name].js",
|
filename: '[name].js',
|
||||||
path: path.resolve(__dirname, "../priv/static/js"),
|
path: path.resolve(__dirname, '../priv/static/js'),
|
||||||
publicPath: "/js/"
|
publicPath: '/js/'
|
||||||
},
|
},
|
||||||
devtool: devMode ? "eval-cheap-module-source-map" : undefined,
|
devtool: devMode ? 'eval-cheap-module-source-map' : undefined,
|
||||||
module: {
|
module: {
|
||||||
rules: [
|
rules: [
|
||||||
{
|
{
|
||||||
test: /\.js$/,
|
test: /\.js$/,
|
||||||
exclude: /node_modules/,
|
exclude: /node_modules/,
|
||||||
use: {
|
use: {
|
||||||
loader: "babel-loader"
|
loader: 'babel-loader'
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
test: /\.s?css$/,
|
test: /\.s?css$/,
|
||||||
use: [
|
use: [
|
||||||
MiniCssExtractPlugin.loader,
|
MiniCssExtractPlugin.loader,
|
||||||
"css-loader",
|
'css-loader',
|
||||||
"postcss-loader",
|
'postcss-loader',
|
||||||
"sass-loader",
|
'sass-loader'
|
||||||
]
|
]
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
@ -53,10 +53,10 @@ module.exports = (env, options) => {
|
|||||||
]
|
]
|
||||||
},
|
},
|
||||||
plugins: [
|
plugins: [
|
||||||
new MiniCssExtractPlugin({ filename: "../css/app.css" }),
|
new MiniCssExtractPlugin({ filename: '../css/app.css' }),
|
||||||
new CopyWebpackPlugin({
|
new CopyWebpackPlugin({
|
||||||
patterns: [{ from: "static/", to: "../" }]
|
patterns: [{ from: 'static/', to: '../' }]
|
||||||
})
|
})
|
||||||
]
|
]
|
||||||
}
|
}
|
||||||
};
|
}
|
||||||
|
Loading…
Reference in New Issue
Block a user